1

这应该很简单,但很多关于 SO 的旧答案似乎有点错误。我希望能够异步加载库、一些插件和一些代码,但要确保它们按顺序执行

这种事情是行不通的,因为脚本在加载时执行,可能不在列出的顺序中:

if (someCondition) {
  $.ajax({
    url: "theLibrary.js",
    dataType: "script",
    cache: true,
    success: function(data) {
      console.log("library loaded and executed");
    }
  });
  $.ajax({
    url: "thePlugin.js",
    dataType: "script",
    cache: true,
    success: function(data) {
      console.log("plugin loaded and executed");
    }
  });
  $.ajax({
    url: "theCode.js",
    dataType: "script",
    cache: true,
    success: function(data) {
      console.log("code loaded and executed");
    }
  });
}

对此的第一个尝试可能是将依赖项嵌套在回调中,如下所示:

if (someCondition) {
  $.ajax({
    url: "theLibrary.js",
    dataType: "script",
    cache: true,
    success: function(data) {
      console.log("library loaded and executed");
        $.ajax({
          url: "thePlugin.js",
          dataType: "script",
          cache: true,
          success: function(data) {
            console.log("plugin loaded and executed");
            $.ajax({
              url: "theCode.js",
              dataType: "script",
              cache: true,
              success: function(data) {
                console.log("code loaded and executed");
              }
            });
          }
        });
    }
  });
}

现在这解决了执行问题(虽然读起来很麻烦),但现在的问题是loading第二个和第三个脚本在加载和执行前一个脚本时被搁置了。换句话说,加载和执行没有完全解耦。

似乎没有延迟执行的选项.ajax或其速记继子。.getScript从文档:

dataType: "script": 将响应评估为 JavaScript 并将其作为纯文本返回。

换句话说,加载和执行似乎是完全耦合的。有没有一种干净的方法来处理这种深度嵌套依赖关系的情况,只使用 jquery,而不需要额外的脚本加载库

4

1 回答 1

0

您可以尝试使用Async.js系列方法,尽管最初对于 Node.js 它也适用于浏览器。

所以基本上你可以做类似的事情

async.series([
    function(callback){
        // do some stuff ...
        callback(null, 'one');
    },
    function(callback){
        // do some more stuff ...
        callback(null, 'two');
    }
],// optional callback
function(err, results){
        // results is now equal to ['one', 'two']
});
于 2013-05-02T10:41:07.297 回答