如何停止/覆盖Jquery TimeOut函数？

Question

我有一个小的jquery片段,它在屏幕顶部显示通知消息,以响应页面上的用户操作.通常在Ajax操作之后显示通知,其中包含动态内容.

例如:

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

通知效果很好,除非用户快速连续执行两个或更多操作,在这种情况下,TimeOut函数会自行混淆,第二个消息似乎在前3000毫秒内.

如果执行新操作,是否有办法"杀死"先前的通知.我对动作/选择器没有问题,只是TimeOut函数....要么停止它,要么以某种方式覆盖它.或者也许有更好的选择让消息在屏幕上停留几秒钟然后消失？

谢谢.

Answer 1

首先,存储setTimeout函数的返回值:

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

然后,当你准备好终止超时时......你只需要调用clearTimeout前一次调用的存储值setTimeout.

// Then clearn the timeout
clearTimeout(timeout);

Answer 2

你可以使用.stop()

停止匹配元素上当前运行的动画.

Answer 3

jQuery 1.4有一个内置的方法来处理动画的延迟,你可以做这样的事情:

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

然后,当您想要清理动画队列时,您可以执行以下操作:

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