JS脚本动态加载不一致

Question

我需要帮助才能使一些动态 js 加载正常工作。我现在遇到的问题是它在加载页面时没有始终如一地加载 js 脚本。这是我打开的页面底部的脚本：

function getJSOnload() {
    var element;
    var parent = document.body;
    var cdn = [
                LoadFormValidationScript(LoginFormValidator),
                LoadFormValidationScript(SetFormLocaleLang)
            ];
    var i = 0, file;
    for (i;i<cdn.length;i++) {
        file = cdn[i];
        element = document.createElement("script");
        element.type = "text/javascript";
        element.src  = file;
        parent.appendChild(element);
        //free file's value
        file = null;
    }
};
    if (window.addEventListener) {
        window.addEventListener("load", getJSOnload(), false);
    }
    else if (window.attachEvent) {
        window.attachEvent("onload", getJSOnload());
    }
    else window.onload = getJSOnload();

这是我在外部 js 文件中的 LoadFormValidationScript

function LoadFormValidationScript(callback){

    function LoadValidationScripts() {

        $.getScript('/plugins/script1.min.js', function() {
            $.getScript('/plugins/script2.min.js', function() {
                $.getScript('/plugins/script3.addons.min.js', function() {
                    $.getScript('/plugins/script.es_ES.js', function() {
                        $.getScript('/plugins/script4.fr_FR.js', function() {
                            $.getScript('/plugins/script5.de_DE.js', callback);
                        });
                    });
                });
            });
        });
    }
    if (!$.fn.formValidation){
        LoadValidationScripts();
    } else {
        if (callback && typeof(callback) === "function") {
            callback();
        }
    }
}

以"setFormLocaleLang"函数为例，因为它很短

function SetFormLocaleLang(){

    var nberOfForm = document.forms.length; //get number of forms on the page

    // if there are no forms in the page don't waist your time
    if (nberOfForm > 0) {
        var Locale = "en_US"; //default formVlaidation language
        //var lang =  $('html').attr('lang'); // get the page language
        var lang = $("#selectedLanguage").attr('data-lang-id');

       // assign the Locale depending on page language
        switch (lang) {
            case "en" : Locale = 'en_US'; break;
            case "fr" : Locale = 'fr_FR'; break;
            case "es" : Locale = 'es_ES'; break;
            case "de" : Locale = 'de_DE'; break;
            default : break;
        };
        //set the locale for all the forms in the page
        for (var i = 0; i < nberOfForm; i++) {
            var strFormID = "#" + document.forms[i].id;
            $(strFormID).formValidation('setLocale', Locale);
        }
    }
}

据说它确实有效并加载了脚本，但并非一直如此，有时我必须刷新页面 3 次才能加载脚本，有时它会在我打开时在第一次尝试时加载页。不确定发生了什么以及为什么我会出现这种行为。

Answer 1

您错误地附加了处理程序 - 您立即调用 getJSOnload()，而不是像您预期的那样等待文档加载。参考，不要调用，函数：

if (window.addEventListener) {
    window.addEventListener("load", getJSOnload, false);
}
else if (window.attachEvent) {
    window.attachEvent("onload", getJSOnload);
}
else window.onload = getJSOnload;

JS脚本动态加载不一致

JS script dynamic loading inconsitent

html

javascript

jquery

loading