jQuery$.when不等待延迟链完成ajax调用

在这里，我尝试按顺序加载几个JS文件。问题是

$。当
未等待链完成时。但是最后一个
$。延迟。然后
按预期工作。当
工作时，我应该怎样做才能使
$


var url=[
"https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.js",
"https://cdnjs.cloudflare.com/ajax/libs/photoswipe/4.1.2/photoswipe.js",
"https://cdnjs.cloudflare.com/ajax/libs/photoswipe/4.1.2/photoswipe-ui-default.js"
];
var xxx=$.Deferred（）；
xxx.then（函数（）{
选项={
数据类型：“脚本”，
url:url[0]，
缓存：false
};
返回$.ajax（options.promise（）；
})
.然后（函数（）{
选项={
数据类型：“脚本”，
url:url[1]，
缓存：false
};
返回$.ajax（options.promise（）；
})
.然后（函数（）{
选项={
数据类型：“脚本”，
url:url[2]，
缓存：false
};
返回$.ajax（options.promise（）；
}).然后（函数（）{
$（“body”）.append（“这是正确的。已加载所有文件。
”；
});
$.when（xxx）.done（函数（）{
$（“body”）.append（“这是错误的。尚未加载JS文件。
”；
});
xxx.resolve（）
您的方法不起作用，因为您从同一承诺创建了两个分支。您拥有以下等价物：

var xxx = $.Deferred();
xxx.then(...).then(...);     // promise chain 1
xxx.then(...)                // promise chain 2
xxx.resolve();               // start the race between the two promise chains

这仅仅是两条独立的承诺链之间的竞争，而这两条承诺链并没有排序或协调。无论哪一个执行时间更短，都将首先结束。他们之间没有协调

有关详细说明，请参阅和

而且，使用
$.when（xxx）.done（）
是不必要的，根本不是问题的一部分。使用
xxx.done（）
可以得到相同的结果


您只能使用一个承诺链来修复它：

p.then(...).then(...).then(...)

然后，一切都被正确地排序和协调

var urls = [
    "https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.js",
    "https://cdnjs.cloudflare.com/ajax/libs/photoswipe/4.1.2/photoswipe.js",
    "https://cdnjs.cloudflare.com/ajax/libs/photoswipe/4.1.2/photoswipe-ui-default.js"
];
let options = {
  dataType: "script",
  url: urls[0],
  cache: false
};
$.ajax(options).then(function() {
    let options = {
      dataType: "script",
      url: urls[1],
      cache: false
    };
    return $.ajax(options);
}).then(function() {
    let options = {
      dataType: "script",
      url: urls[2],
      cache: false
    };
    return $.ajax(options).then(function() {
          $("body").append("Last script loaded<br>");
    });
}).then(function() {
      $("body").append("This is correct. All files are loaded.<br>");
});

var url=[
"https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.js",
"https://cdnjs.cloudflare.com/ajax/libs/photoswipe/4.1.2/photoswipe.js",
"https://cdnjs.cloudflare.com/ajax/libs/photoswipe/4.1.2/photoswipe-ui-default.js"
];
让选项={
数据类型：“脚本”，
url:url[0]，
缓存：false
};
$.ajax（选项）.then（函数（）{
让选项={
数据类型：“脚本”，
url:url[1]，
缓存：false
};
返回$.ajax（选项）；
}).然后（函数（）{
让选项={
数据类型：“脚本”，
url:url[2]，
缓存：false
};
返回$.ajax（选项）.then（函数（）{
$（“正文”）.append（“上次加载的脚本
”）；
});
}).然后（函数（）{
$（“body”）.append（“这是正确的。已加载所有文件。
”；
});

工作示例：


或者，如果您仍然希望使用
var xxx=$.Deferred（）
初始化链，以便以后可以使用
xxx.resolve（）
，那么您也可以这样做，但不能在（xxx）时使用
xxx.then（）
或
$
因为这是一个完全独立的分支，根本没有链接到其他承诺链

以
$.Deferred（）
开始的工作示例：
如果它正在使用
$.Deferred。那么
正如预期的那样，那么为什么要使用
$。当
？这里根本没有理由使用
$.when（）
或您的
$.Deferred（）
。以
$.ajax（…）开始链。然后（）。最后一个
.then（）
处理程序应该可以正常工作，以了解整个链何时完成。当return
$时，也没有理由使用
return$.ajax（）.promise（）
。ajax（…）
工作正常。