javascript - 使用顺序回调自动加载 javascript 文件

Question

我有下面的javascript列表，这个列表中的每个项目都有一个脚本文件url和一个回调函数，我想要做的是迭代这个列表，加载每个脚本，然后执行回调函数，然后不移动到下一个项目，除非当前回调执行完毕。

var data = { 
    scripts: [
        {
            file    : 'some-script.js',
            callback: function() {
                // do some code here
            },
        },
        {
            file    : 'another-script.js',
            callback: function() {
                // do some code here
            },
        },
        ...
    ]
};

如果可能的话，我怎样才能自动执行此操作？

Answer 1

(我假设您正在使用 JSONP 加载外部脚本)您将面临的问题是这些脚本不会同时加载。

下面是一些代码，一旦加载关联的脚本，它们就会调用您的回调函数。

    function include_js(url, callback) {  // http://www.nczonline.net
        var script = document.createElement("script");
        script.type = "text/javascript";

        if (script.readyState) {  //IE
            script.onreadystatechange = function(){
                if (script.readyState == "loaded" || script.readyState == "complete"){
                    script.onreadystatechange = null;
                    callback();
                }
            };
        } else {  //Others
            script.onload = function(){
                callback();
            };
        }
        script.src = url;
        document.getElementsByTagName("head")[0].appendChild(script);
    }

//Edit

    for (var i = 0; i < data.scripts.length; i++) {
         include_js(data.scripts[i].file, data.scripts[i].callback);
    }