Question

我在通过脚本标签插入的页面上有一个javascript文件（initial.js），如下所示：

<script src="initial.js"></script>

此文件创建dom元素（比如说两个链接），并通过jQuery ajax方法异步加载另一个jQuery插件（plugin.js）。单击这两个链接将显示jQuery插件（plugin.js）中的模块。

然后修改javascript文件（initial.js）以通过jQuery ajax而不是通过脚本标记在页面上异步加载。这导致一些事件没有间歇性地附加到链接上，这导致插件没有被调用。

我认为浏览器按照自己的顺序加载异步脚本，因此链接无法间歇性地启动插件。有关这个新设置解决此问题的任何指示吗？

Answer 1

在高层，我认为你需要研究require.js之类的东西。或者，您可以查看一些jQuery事件处理代码，该代码允许您侦听调用的加载事件，这可以帮助您确定何时加载一个脚本，然后再加载下一个脚本。

Answer 2

过去你可能尝试过这样的事情：

var output;
$.get('data.php',function(data){
    output=data;
});
alert(output);

您将收到一个未定义的错误，因为在转到下一个代码之前，Javascript不会等待返回AJAX调用。

脚本也是如此。如果您对多个脚本进行多次调用，您可能会获得最快的返回，并执行该脚本。如果你加载一个10kb的脚本然后加载一个1kb的脚本，1kb脚本可能会返回最快的，然后执行即使它是在10kb脚本之后调用的。

要解决此问题，您可以创建一个队列系统，然后仅在上一个脚本加载后加载每个脚本：

var scripts=['script1.js','script2.js','script3.js'];

$(document).ready(function(){
    loadScript();
});

function loadScript(){
    if(sendQueue.length==0)
        return;
    $.getScript(scripts[0],function(){
        scripts=scripts.slice(1);
        loadScript();
    });
}

但是如果你是从脚本中的脚本中加载脚本......非常感觉，那么这仍然可能无效。

从异步加载的js文件异步加载js文件

2 个答案: