2010-04-05 17 views
25

Tengo un pequeño fragmento de jquery que muestra un mensaje de notificación en la parte superior de la pantalla en respuesta a las acciones del usuario en una página. La notificación a menudo se muestra después de las acciones de Ajax con contenido dinámico dentro de ella.Cómo detener/anular una función Jquery TimeOut?

Por ejemplo:

$("#mini-txt").html("Thank you!"); 
$("#mini").fadeIn("fast"); 
setTimeout(function() {$("#mini").animate({height: "hide", opacity: "hide"}, "medium");}, 3000); 

La notificación funciona bien, excepto cuando un usuario hace dos o más acciones en rápida sucesión, en cuyo caso la función de tiempo de espera induzca a confusión en sí y el segundo mensaje parece venir dentro de la 3000 milisegundos anteriores.

Hay una manera de "matar" la notificación anterior si se realiza una nueva acción. No tengo ningún problema con las acciones/selectores, solo la función TimeOut ... deteniéndola o anulándola de alguna manera. ¿O tal vez hay una mejor alternativa para que el mensaje permanezca en la pantalla durante unos segundos antes de desaparecer?

Gracias.

Respuesta

56

En primer lugar, almacenar el valor devuelto por la función setTimeout:

// Set the timeout 
var timeout = setTimeout(function() 
    { 
     // Your function here 
    }, 2000); 

Luego, cuando esté listo para matar el tiempo de espera ... que acaba de llamar clearTimeout con el valor almacenado de la anterior llama al setTimeout.

// Then clearn the timeout 
clearTimeout(timeout); 
+0

¿ejecutará la función de tiempo de espera después de borrar? – sbs

6

Puede utilizar .stop()

detener la animación actualmente en ejecución sobre los elementos coincidentes.

6

jQuery 1.4 ha construido en un método para manejar los retrasos para animaciones que puede hacer algo como esto:

$("#mini-txt").html("Thank you!"); 
$("#mini").fadeIn("fast").delay(3000).animate({height: "hide", opacity: "hide"}, "medium"); 

Y más tarde cuando se desea limpiar la cola de animación que puede hacer:

$("#mini").stop(true); 
0

Esto borrará el tiempo de espera después del rodaje función con retardo de 500 ms

var timeout = setTimeout(function(){ 

/* YOUR FUNCTION */ 

}, 500, function(){ 
    clearTimeout(timeout); 
});