等待所有多个异步ajax调用完成

Question

您好，我有多个 ajax 调用，我想做的是异步触发所有这些调用，然后等到所有调用完成后再处理返回的数据。我尝试使用 $.when 但没有成功。这是我的代码：

//form_identifier_list is my flag to get the multiple forms in my html page
function test(form_identifier_list){
    var deffereds = [];

    $.each(form_identifier_list, function(key,value){
        var this_form = $(this).parents('.ajaxed_form');
        deffereds.push( $.post($(this_form).attr("action"), $(this_form).serializeForm()) );
    });

    $.when.apply($, deffereds).done(function(){
        //how to output response obj?? i tried console.log(data) to no avail
    }).fail(function(){

    }).always(function(){

    });
}

我还注意到我的 ajax 请求没有响应（我在浏览器上验证了这一点）。

有没有办法让多个ajax调用异步触发，然后等待所有调用完成然后访问数据？

谢谢

Answer 1

在when的jquery页面中，有一个部分说：

在将多个 Deferred 对象传递给 jQuery.when() 的情况下，该方法从新的“主”Deferred 对象返回 Promise，该对象跟踪已传递的所有 Deferred 的聚合状态。

ajax页面上也有这个

从 jQuery 1.5 开始，$.ajax() 返回的 jqXHR 对象实现了 Promise 接口

因此，我们可以将 的返回值分配ajax给一个变量，并将这些变量传递给.when.

要稍微扩展页面上给出的示例.when并集成任意数量的 ajax 调用，您可以执行以下操作：

var ajaxes = [];
for(var i=0; i<10; i++) {
    ajaxes.push($.ajax('a.php', {data: {t: i}}));
}
$.when.apply($, ajaxes)
    .done(function(){
        for(var i=0;i<arguments.length; i++) {
            $('#output').append(arguments[i] + "<br>");
        };
    });

如果你有已知数量的 ajax 调用，它会变得更简单......你可以做更多类似这样的事情：

var a1 = $.ajax(...);
var a2 = $.ajax(...);
var a3 = $.ajax(...);
$.when(a1,a2,a3).done(function(o1, o2, o3) {
  $('#output').append(o1).append(o2).append(o3);
});

第一个例子基本上做同样的事情。