jQuery führen eine Gruppe von Funktionen nach dem anderen

Question

Ich habe zwei Gruppen von Funktionen:

$(document).ready(function() { 

    var id = $(this).attr('id'); 

    // First group of functions  
    getCountry(id); 

    // Second group of functions 
    getResult(id, 'all'); 

}); 

Innerhalb jeder Gruppe sind Funktionen Ajax Anrufe und miteinander verkettet. Es bedeutet, dass getCountry() zuerst ausgeführt wird und getRegion() auf success Ajax Eigenschaft aufruft, dann getRegion() Anrufe getTown() auf success Ajax Eigentum und so weiter. Diese Funktionen werden verwendet, um eine Formular-Dropdown-Liste (selects) zu füllen. Ich werde dann die Städte der Region des Landes bekommen, die ich ausgewählt habe.

Ich brauche die Formularlisten, die ausgefüllt werden müssen, bevor ich die getResult() Funktion ausführen kann.

Ich will nicht getResult() innen getCountry() nennen, weil ich auch getResult() verlangen, wenn der Benutzer Änderungen Optionen ausgewählt, nachdem die Seite geladen wird. In diesem Fall wird getResult() verschiedene andere Parameter als 'all' annehmen.

ich mich für eine einfache Möglichkeit, mich auf meine $(document).ready(function(), um neu zu schreiben zu sagen:

1. Erstens: laufen getCountry() und seine Abhängigkeit Funktionen
2. dann getResult() und seine Abhängigkeit Funktionen laufen

Ich bin ein wenig verloren in jQuery doc über Rückrufe und promise(). Ich würde wirklich etwas Hilfe schätzen, um mir zu erlauben weiterzumachen, wissend, dass ich später ernsthaft zum Arzt zurückkehren werde.

Answer 1

Sie können versuchen, Deferred Object

// Create a deferred object 
var deferred = $.Deferred(); 

Definieren Sie die Funktion auf dem latente Objektauflösung

// This function executes as soon as the deferred object gets resolved 
deferred.done(function(value) { 
    getResult(id, 'all'); 
}); 

Auf dem Rückruf der letzten Funktion von getCountry() Gruppe, lösen das latente Objekt aufgerufen werden :

// Resolve the deferred object 
deferred.resolve(response); 

Überprüfen Sie diese article

Answer 2

Versuchen Sie die Verwendung von Deferred wie unten.

$(document).ready(function() { 

    var id = $(this).attr('id'); 
    var deferred = $.Deferred(); 
    // First group of functions  
    getCountry(id); //Inside getCountry method, make a call to deferred.resolve(); 

    // Second group of functions 
    //Now make call to getResult only when promise is resolved. 
    deferred.done(function(result){ 
     getResult(id, 'all'); 
    }); 
}); 

Answer 3

können Sie Deffered von jQuery verwenden. Um die Dokumente zu zitieren

versuchen Sie nach unten Code.

$(document).ready(function() { 

var id = $(this).attr('id'); 
getCountry(id).done(getResult(id, 'all')); 

}); 
function getCountry(id){ 
var dfd = $.Deferred(); 
// ur ajax calls and chains of onSuccessCalls 
//call `resolve` on the deferred object, once you're done 
Success: 
    dfd.resolve(); 

// return the Deferred Object  
return dfd; 
}