Question

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

我在this Fiddle中创建了相关代码的示例，而不是在几个代码块中编写代码。

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

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

我尝试移动.delay，将代码添加到mouseout()事件中，但我对jQuery缺乏了解，这几乎阻止了我的进展。

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

非常感谢。

Answer 1

由于您在显示功能中调用了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

this你想达到什么目标？

$("#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
});

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

2 个答案: