Warte, bis alle multiplen asynchronen Ajax-Aufrufe abgeschlossen sind

Question

Hallo Ich habe mehrere Ajax-Aufruf, was ich tun wollte ist, sie alle asynchron abzufeuern dann warten, bis alle von ihnen fertig sind, bevor die zurückgegebenen Daten verarbeitet werden. Ich habe versucht, $ .when, aber ohne Erfolg zu verwenden. Hier ist mein Code:

//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(){ 

    }); 
} 

Ich habe auch meine AJAX-Anfragen haben nicht reponse (was ich in meinem Browser überprüft).

Gibt es eine Möglichkeit, mehrere Ajax-Aufrufe asynchron zu feuern und dann zu warten, bis alle fertig sind und auf die Daten zugreifen?

Dank

Answer 1

In der jquery Seite auf when, gibt es einen Abschnitt, der sagt:

In dem Fall, wo mehrere latente Objekte jQuery.when übergeben werden(), wobei das Verfahren die zurück Versprechen von einem neuen "Master" Zurückgestelltes Objekt, das den Aggregatstatus aller Zurückgestellten nachverfolgt.

Auch gibt es diese auf der ajax page

Die jqXHR von $ Schnipsel() als von jQuery 1.5 implementieren, um die Versprechen Schnittstelle

So zurückgegebenen Objekte zuweisen können wir nur die Rückgabewert der ajax an eine Variable und diese Variablen in die .when übergeben.

Um etwas über die auf der .when Seite gegebenen Beispiel erweitern und eine beliebige Anzahl von Ajax-Aufrufe integrieren, können Sie etwas tun können:

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>"); 
     }; 
    }); 

Wenn Sie eine bekannte Anzahl von Ajax-Aufrufe haben, es wird ein etwas einfacher ... Sie können etwas mehr wie folgt tun:

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); 
}); 

Das erste Beispiel macht im Grunde dasselbe.

Answer 2

Ich möchte dir etwas vorschlagen schmutzig (:

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 
} 
}) 

Answer 3

Es ist möglich, auf mehreren JavaScript-Funktionen asynchron aufgerufen (zB Ajax-Funktionen), für jede der Funktionen warten zu beenden und dann weiter (zB Zugang data) mit setInterval.

Betrachten Sie drei JavaScript-Funktionen (i = 0,1,2). Jede Funktion führt die gleiche Anzahl von Operationen (10) .Nach dem Systemstart (T_0) hat jede der Funktionen einen Anfang (T_ (3i + 2) oder 〖T 〗_2, 〖T〗 5 und 〖T〗 8), eine Operation, die zehnmal ausgeführt wird (T (3i + 3) oder 〖T〗 3, 〖T〗 6 und 〖T〗 9) und eine Endung (T (3i + 4) oder 〖T〗 _4, 〖T〗 _7 und 〖T〗 _10) . Wenn die Funktionen beginnen können, können die Funktionen in beliebiger Reihenfolge beginnen. Jede Funktion führt ihre Operationen zehn Mal aus. Wenn jede Funktion ihre Operation beendet hat, fährt das System fort (T_1) und die drei Funktionen können erneut ausgeführt werden.

Abbildung 1: Ein Petri-Netz-Modell für drei Funktion Synchronisieren Anrufe

Die Funktion, die setInterval führt das tut folgendes:

1. Wählt eine (Ajax) Funktion auszuführen, und führt die Funktion . Zum Beispiel kann jeder von T_3, T_6 und 〖T 〗_9 in Fig. 1 einen Funktionsaufruf für eine (ajax) -Funktion darstellen, die zehnmal aufgerufen wird.
2. Wenn jede (ajax) -Funktion ihre Aufgabe beendet hat, fährt die Funktion fort und löscht das Intervallobjekt.

Betrachten Sie den folgenden Beispielcode-Schnipsel: [. Diese Antwort hat eine PDF version dessen Gestalt ist dynamisch und interaktiv]

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);