jQuery - 防止鼠标快速移动导致悬停功能排队答案

【问题标题】：jQuery - Preventing queuing up hover functions from fast mouse movementsjQuery - 防止鼠标快速移动导致悬停功能排队
【发布时间】：2010-11-23 14:30:14
【问题描述】：

这是一个我似乎经常遇到的问题。例如，如果我有一个使用 jQuery hover() 函数的下拉导航菜单，并且我快速将鼠标光标移到 <li> 上大约 10 次，子导航将出现，然后消失 10 次。

有什么办法可以防止这个问题的发生吗？

谢谢

【问题讨论】：

非常相似，大了 3 分钟：stackoverflow.com/questions/4256962/…
我经常这样做，但是这次我没有代码可以发布，只是一个问题:)
@sje397 很好的发现。那里也更好地解释了 HoverIntent。

标签： jquery hover delay

【解决方案1】：

是的，使用停止功能！

$(this).stop().animate(...);

或者

$(this).stop().show();

【讨论】：

【解决方案2】：

我们将 Hoverintent 用于我们的菜单。在动画之前给出一个智能延迟：

http://cherne.net/brian/resources/jquery.hoverIntent.html

【讨论】：

【解决方案3】：

使用stop()函数清空一个元素的动画队列：

$(this).stop(true).show();

【讨论】：

【解决方案4】：

好吧，您可以在进入时取消绑定事件，并在退出时再次绑定。当我负担不起重新进入时，我倾向于使用信号量变量。

话虽如此，hover() 事件本身可能不是在排队，而是动画本身。请注意您有一个动画正在进行中（信号量），不要再发出另一个，或者stop() 动画正在进行中，然后再继续。

【讨论】：