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（），该方法从一个新的“主”返回Promise 跟踪所有Deferred的聚合状态的延迟对象它已经过去了。

此问题还有ajax page

jQuery 1.5中$ .ajax（）返回的jqXHR对象实现了承诺界面

因此我们可以将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);
});

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

Answer 2

可以异步调用多个JavaScript函数（例如Ajax函数），等待每个函数完成，然后使用setInterval继续（例如访问数据）。

考虑三个JavaScript函数（i = 0,1,2）。每个功能执行相同数量的操作（10）。系统启动后（T_0），每个功能都有一个开头（T_（3i + 2）或〖T〗_2，〖T〗_5和〖T〗 8），执行十次操作（T （3i + 3）或〖T〗_3，〖T〗_6和〖T〗 9），以及一个结尾（T （3i + 4）或〖T〗_4，〖 T〗_7和〖T〗_10）。当函数准备好开始时，函数可以以任何顺序开始。每个功能执行十次操作。当每个功能完成其操作后，系统继续（T_1）并且可以再次执行三个功能。

图1：用于同步三个函数调用的Petri网模型

setInterval执行的函数执行以下操作：

选择要执行的（ajax）函数，并执行该函数。例如，图1中的T_3，T_6和〖T〗_9中的每一个都可以表示被调用十次的（ajax）函数的函数调用。
如果每个（ajax）函数都已完成其任务，则该函数继续并清除interval对象。

请考虑以下示例代码段：

var s1=false, s2=false, s3=false;
// a1 (an Ajax function) sets s1 to true if it is finished
function a1() { …}
// a2 (an Ajax function) sets s2 to true if it is finished 
function a2() {…}
// a3 (an Ajax function) sets s3 to true if it is finished
function a3() {…}
// fcon is the function to execute when a1, a2 and a3 has finished.
function fcon() {…}
function myFunction() {
  var af = [], i;
  If (s1) af[af.length] = 1;
  If (s2) af[af.length] = 2;
  If (s3) af[af.length] = 3;
  If (af.length==0) {
    fcon();
    clearInterval(ai);
    ai = undefined;
  } else {
    i = Math.round( (af.length-1)*Math.random());
    switch(af[i]) {
      case 1:
        a1(); break;
      case 2:
        a2(); break;
      case 3:
        a3(); break;
      default:
        break;
    }
  }
}
var ai = setInterval(“myFunction()”, 1000);

[这个答案有PDF version，其形象是动态和互动的。]

Answer 3

我想建议你弄脏的东西（：

var counter=0;
$.ajax(success:function(){counter++})
$.ajax(success:function(){counter++})
$.ajax(success:function(){counter++})
$.ajax(success:function(){counter++})
$.ajax(success:function(){counter++})

var interval = setInterval(function(){
 If(counter===5){
   // fire event to elaborate data
   // clear interval
 }
})

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

3 个答案: