funciones Cómo hacer jQuery secuenciales

Question

Tengo el siguiente código:

$(document).ready(function() { 
    loadStuff(someURL, someID); 
    showStuff('foo'); 
}); 

showStuff() se basa en el contenido generado por loadStuff(), pero parece como si showStuff() está saltando el arma antes de que dicho contenido se encuentra disponible . ¿Cómo puedo obligarlos a ejecutar secuencialmente?

Actualización: Sí, hay llamadas ajax en loadStuff, pero lamentablemente son jsonp, por lo que no se pueden llamar sincrónicamente.

Answer 1

reescribir como:

$(document).ready(function() { 
    loadStuff(someURL, someID, function() { showStuff('foo'); }); 
}); 

donde el tercer parámetro de loadStuff es la devolución de llamada para llamar después de que el contenido se carga

Answer 2

llama a showStuff en la exitosa devolución de llamada de ajax que hace loadStuff.

Ver también How can I get jQuery to perform a synchronous, rather than asynchronous, Ajax request?

Answer 3

Ellos hacen ejecución secuencial, pero lo que hay dentro loadStuff no son necesariamente (especialmente si está realizando loadStuffasincrónica peticiones HTTP). Es el código dentro deloadStuff que no se ejecuta secuencialmente.

Por lo general, me gustaría simplemente que "necesitamos manera más contexto código para responder a esta pregunta", pero no lo suficiente como para decir esto:

utilizar una petición HTTP sincrónico, o mover la llamada a showStuff en la devolución de llamada en éxito para su sesión asíncrona, de modo que solo se active cuando la solicitud se haya completado.

Answer 4

La manera elegante está utilizando jQuery.Deferred, en particular Deferred.pipe. Vea la pregunta Understanding jQuery Deferred.pipe() para un ejemplo.

Answer 5

Puede:

Pass showStuff como delegado a una devolución de llamada que se invoca en una respuesta exitosa de su llamada AJAX dentro loadStuff().

Ejemplo:

function loadStuff() { 

     $.ajax({ 
     url: "Stuff/GetStuff", 
     success: function(){ 
     showStuff(); 
     } 
    }); 

} 

O, la forma menos elegante, simplemente comprobar si los datos se cargan de vez en cuando, hasta que es:

var timerId = setInterval(showStuff, 50); 

function showStuff() { 
    if (stuffIsLoadded) { 
    // do show stuff stuffs. 
    clearInterval(timerId); 
    } 
}