Question

我正在研究js脚本加载技术，并希望在加载所有内容/资源时显示自定义加载器。以下是按照我的说法按顺序加载js脚本但我的web应用程序在启动后会抛出一些错误。

我的问题是：下面的脚本（在我的HTML底部的jQuery之后被称为<script>）与简单地将所有这些js脚本称为<script>的方式不同在HTML的头部？为什么错误在一个而不是另一个？

$(document).ready(function(){
    jLoader(scripts[0]);
});
var i = 0;
function jLoader (script){
    return $.ajax({
                method: "GET",
                dataType: "script",
                url: script,
                context: document.body,
                cache:true,
        }).done(function() {
        console.log(script + ' loaded!');
        step();
        }
    });
}

function step(){
    i = i + 1;
    jLoader(scripts[i]);
}

var scripts = ['js/materialize.js','http://cdn.leafletjs.com/leaflet-0.7.5/leaflet.js','js/leaflet.awesome-markers.js',    
    'js/bouncemarker.js','https://cdn.firebase.com/js/client/2.3.1/firebase.js','js/geofire.min.js','js/myScript.js'];

Answer 1

在step();

之后，有一个结束的大括号

当您将变量定义置于顶部时，它应该起作用::

var i = 0;
var scripts = ['http://cdn.leafletjs.com/leaflet-0.7.5/leaflet.js','https://cdn.firebase.com/js/client/2.3.1/firebase.js'];
$(document).ready(function(){
    jLoader(scripts[0]);
});

function jLoader (script){
    return $.ajax({
                method: "GET",
                dataType: "script",
                url: script,
                context: document.body,
                cache:true,
        }).done(function() {
        console.log(script + ' loaded!');
        step();
    });
}

function step(){
    i = i + 1;
    jLoader(scripts[i]);
}

至少在这里：http://jsfiddle.net/adweqcm2/

但请记住：在生产环境中，建议连接脚本。

JS脚本加载

1 个答案: