funzione di Forza Javascript chiamata ad aspettare fino a quando quello precedente è finito

Question

Ho una semplice funzione Javascript:

makeRequest(); 

Si fa un mucchio di roba e pone una serie di contenuti nel DOM.

faccio un paio di telefonate in questo modo:

makeRequest('food'); 
makeRequest('shopping'); 

Tuttavia, entrambi fuoco così rapidamente che si stanno intensificando in piedi a vicenda. In definitiva ho bisogno di avere la funzionalità di.

makeRequest('food'); 
wait.... 
makeRequest('shopping'); only if makeRequest('food') has finished 

Pensieri su come eseguirli solo uno alla volta?

Grazie!

Answer 1

Se queste funzioni eseguono effettivamente una richiesta AJAX, è meglio mantenerle asincrone. È possibile effettuare una richiesta AJAX sincrona, ma impedirà al browser di rispondere e portare a un'esperienza utente negativa.

Se ciò che si richiede se queste richieste AJAX vengono eseguite una dopo l'altra perché dipendono l'una dall'altra, è necessario esaminare la propria funzione per verificare se fornisce un meccanismo di callback.

makeRequest('food', function() 
{ 
    // called when food request is done 
    makeRequest('shopping'); 
}); 

utilizzando jQuery, sembra qualcosa di simile

$.get("/food", function(food) 
{ 
    // do something with food 

    $.get("/shopping", function(shopping) 
    { 
     // do something with shopping 
    }); 
}); 

Answer 2

mi sento di raccomandare che semplicemente scrivere loro in modo asincrono - per esempio, chiamare makeRequest ('shopping'); dal gestore di completamento AJAX della prima chiamata.

Se non si vuole scrivere il codice in modo asincrono, vedere Javascript Strands

Answer 3

Suppongo che si dispone di un metodo di callback che si prende cura della risposta per la richiesta? Fatto ciò, fai la prossima richiesta.

Dichiarare una matrice per la coda, e una bandiera per tenere traccia dello stato:

var queue = [], requestRunning = false; 

Nel metodo makeRequest:

if (requestRunning) { 
    queue.push(requestParameter); 
} else { 
    requestRunning = true; 
    // do the request 
} 

Nel metodo di callback, dopo aver preso cura della risposta:

if (queue.length > 0) { 
    var requestParameter = queue.splice(0,1)[0]; 
    // do the request 
} else { 
    requestRunning = false; 
} 

Answer 4

Se è necessario eseguire una serie di richieste in sequenza, vedere Peter Baker's answer a una mia domanda simile.