Al animar en jQuery, ¿cuál es la mejor práctica para activar una devolución de llamada solo cuando TODOS los elementos están listos para animar y no para cada elemento?Al animar, ¿cómo se activa la devolución de llamada solo cuando se hacen todos los elementos?
Por ejemplo:
$('.someElements').fadeOut('fast', function() {
// dont do this until ALL elements are done fading
}
Esto podría ser un fragmento de intentar:
var numberOfElements = $('.someElements').length;
$('.someElements').fadeOut(fast, function() {
if(numberOfElements-- > 0) return;
alert('call the Fireman!');
});
La alerta es sólo un marcador de posición hasta el final -llamada que debes disparar.
EDITAR (de otra manera):
También se puede coger todos los elementos, pero no la última uno.
$('.someElements').not(.someElements:last).fadeOut();
y luego añadir un fadeOut con devolución de llamada sólo para lo
$('.someElements:last').fadeOut(fast, function(){
// do something, it's the end of the world
};
¡Genial! Pero, para hacer que la comparación se haga realidad, la condición debería ser (--númeroDeElementos> 0) ¿verdad? Para disminuir la variable antes de la comparación. –
- es un operador LeftHandSideExp.La expresión disminuye primero y luego evalúa la comparación. Digamos que estás en el último ciclo: tienes 1 elemento, la expresión dice: 1--> 0? Falso, no regrese, vaya a la siguiente línea y ejecute la llamada de alerta. – microspino
Para que esto funcione, la condición debe ser (--númeroDeElementos> 0) – aghoshx
Esta es una gran pregunta, según el jQuery docs:
Si se animan múltiples elementos, es importante señalar que la devolución de llamada se ejecuta una vez por emparejado elemento, no una vez para la animación como un todo.
Para evitar esta limitación, usted podría:
.someElements, y establecer una devolución de llamada por separado para cada uno.count que realiza un seguimiento de la cantidad de devoluciones de llamadas totales que hay.count hasta que llega a 0.Cuando el recuento llegue a 0, todas las devoluciones de llamada se completa, y se le garantiza que todos los elementos se hacen animación. A partir de aquí, se puede entonces tiene código especial en su devolución de llamada que hace lo que tiene que hacer ...
Gracias Justin! Esto parece un poco complicado si solo quieres que la devolución de llamada se active una vez, pero también es ideal para cuando necesitas que pase algo para cada animación. Para este caso más simple, me gustaría ir con la respuesta de Microspino, sin embargo. –
Más últimas versiones de jQuery (versión 1.6 y posteriores) incluyen la idea de un promise. El uso de esta función elimina la necesidad de una solución alternativa. Por ejemplo:
// define the animation on many elements
$('.someElements').fadeOut('fast');
// define the promise that is called once all element animations are done
$('.someElements').promise().done(function() {
// put callback actions here
});
¿No entiendo bien su pregunta? Todos esos elementos deben terminar su animación al mismo tiempo. Todos obtienen la duración de "rápido", por lo que todos terminan al mismo tiempo. – Tejs
¿Desea activar la devolución de llamada solo ** una vez **? –
Tejs: Como Justin menciona a continuación, se activará una devolución de llamada para cada elemento de la colección. Y Félix, sí, solo quiero disparar la devolución de llamada una vez. Decidió ir con la respuesta de Microspino a continuación. –