jquery - Serialisierung Ajax Anrufe mit WHEN und

Question

Ich habe wenige Ajax-Methoden und ich möchte einige Code nach dem erfolgreichen Abschluss alle diese Ajax-Aufrufe ausführen. Ich kann die Ajax-Methoden nicht ändern oder neu definieren. Bitte lassen Sie mich wissen, wie dies zu erreichen ist.

Ich habe versucht, mit WHEN aber es sofort aufgerufen und nicht zu warten alle Anrufe abgeschlossen werden. (Wie vorgeschlagen, sobald ich Rückkehr in loadData1() hinzugefügt, es funktioniert gut.)

Jetzt ist mein Problem ist, wenn eine Anfrage (loadData1() oder loadData2()) einen Fehler hat, wird "then()" nicht ausgeführt. Bitte lassen Sie mich wissen, wie Sie dies erreichen können.

var load1 = loadData1(); 
var load2 = loadData2(); 
var load3 = loadData3(); 
var load4 = loadData4(); 

$.when(load1, load2, load3,load4).then(function() { 
     console.log("All done"); 
}); 

function loadData1() { 
    return $.getJSON("http://10.1.2.3/cgi-bin/GetData1.cgi", function (data) { 
     console.log(data); 
    }); 
} 

Dank

Answer 1

Sie funktionieren wie

function first() { 
    return $.ajax(...); 
} 

function second(data, textStatus, jqXHR) { 
    return $.ajax(...); 
} 

function third(data, textStatus, jqXHR) { 
    return $.ajax(...); 
} 

function main() { 
    first().then(second).then(third); 
} 

Kontrolle dieser für weitere Einzelheiten jquery-promises

Answer 2

dieses Versuchen

var promise = loadData1(); 


var load2 = loadData2(); 
var load3 = loadData3(); 
var load4 = loadData4(); 

promise.then(loadData2).then(loadData3).then(loadData4).then(function (E) { 
         // 
        }); 

function loadData1() { 
    $.getJSON("http://10.1.2.3/cgi-bin/GetData1.cgi", function (data) { 
     console.log(data); 
    }); 

var deferred = new $.Deferred(); 
    deferred.resolve(); 
    return deferred.promise(); 
} 

Answer 3

Sie sollten verwenden können gib etwas in deinen Funktionen zurück. Das ist die erste Sache. Die Sekunde, wenn Sie warten, müssen Sie auf Ergebnisse von Funktionen warten, anstatt load1, load2, load3, load4load1(), load2(), load3(), load4() zu verwenden.

Im Folgenden ein Beispiel, das 4 verzögerte Funktionen simuliert (Ihre Ajax-Anfragen).

// load1, load2, load3, load4 are defined to simulate promises and some work behind it 
 

 
// here is var load1 = loadData1(); 
 
var load1 = function() { 
 
    return $.Deferred(function(defer) { 
 
     setTimeout(function() { 
 
      $('#log').append('<div>loadData1()</div>'); 
 
      defer.resolve(); 
 
     }, 150); 
 
    }); 
 
} 
 

 
// here is var load2 = loadData2(); 
 
var load2 = function() { 
 
    return $.Deferred(function(defer) { 
 
     setTimeout(function() { 
 
      $('#log').append('<div>loadData2()</div>'); 
 
      defer.resolve(); 
 
     }, 600); 
 
    }); 
 
} 
 

 
// here is var load3 = loadData3(); 
 
var load3 = function() { 
 
    return $.Deferred(function(defer) { 
 
     setTimeout(function() { 
 
      $('#log').append('<div>loadData3()</div>'); 
 
      defer.resolve(); 
 
     }, 300); 
 
    }); 
 
} 
 

 
// here is var load4 = loadData4(); 
 
var load4 = function() { 
 
    return $.Deferred(function(defer) { 
 
     setTimeout(function() { 
 
      $('#log').append('<div>loadData4()</div>'); 
 
      defer.resolve(); 
 
     }, 200); 
 
    }); 
 
} 
 

 

 
$(document).ready(function() { 
 
    $.when(load1(), load2(), load3(), load4()) 
 
     .then(function() { 
 
      $('#log').append('<div>All done.</div>'); 
 
     }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="log"></div>

Answer 4

Sie können versuchen, eine Nutzenfunktion wie

function allCompleted(array) { 
    var deferred = jQuery.Deferred(), 
    counter = array.length, 
    results = []; 
    $.each(array, function(i, item) { 
    item.always(function() { 
     results[i] = [].slice.call(arguments, 0) 
     if (--counter == 0) { 
     deferred.resolveWith(undefined, results); 
     } 
    }); 
    }); 
    return deferred.promise(); 
} 

dann

var load1 = loadData1(); 
var load2 = loadData2(); 
var load3 = loadData3(); 
var load4 = loadData4(); 

allCompleted([load1, load2, load3,load4]).then(function() { 
     console.log("All done"); 
}); 

Demo zu verwenden: Fiddle