鼠标hover时jQuery暂停延迟计时器

我目前正在学习MVC3，并且在我的学习过程中一直在为我的项目添加几个jQuery脚本，试图同时学习它。 事情进展顺利，但在这种情况下，我似乎无法弄清楚我必须做些什么来实现我想要的function。

我已经在这个小提琴中创建了相关代码的示例，而不是在几个代码块中编写代码。

在我的代码中发生的是，当按下按钮时，消息div从左侧滑出，3秒后它将再次滑出。 如果用户在滑出时将鼠标放在消息div上，则会添加一条消息。

除了一个小的添加之外，这几乎是我想要的; 当用户将鼠标放在消息div上时，我希望它保持打开状态，直到它们移开鼠标，然后它会向后滑动，目前它在3秒钟后仍然会滑开。

我已经尝试移动.delay ，将代码添加到mouseout()事件中，但是我在jQuery中缺乏知识几乎阻止了我的进展。

任何人都可以解释如何做到这一点和/或指出一些例子。

非常感谢。

Answer 1

由于您在显示function中调用了clear（因而延迟3秒），因此我建议使用以下mouseover / mouseout处理程序：

 $("#messageWrapper").mouseover(function() { $("#testlabel").text("mouseover"); $("#messageWrapper").css('width', 'auto'); $("#messageWrapper .messageBox").text(something); $(this).clearQueue(); }).mouseout(function() { $("#testlabel").text("mouseout"); clearMessages(); }); 

编辑小提琴： http ： //jsfiddle.net/vypTA/7/ – 猜你可以调整明确的延迟（将其作为arg或其他东西传递）

Answer 2

这是你想要实现的吗？

 $("#messageWrapper").mouseover(function() { $("#testlabel").text("mouseover"); $("#messageWrapper").css('width', 'auto'); $("#messageWrapper .messageBox").text(something); $("#messageWrapper").stop(); // added this line }).mouseout(function() { $("#testlabel").text("mouseout"); clearMessages(); // added this line });