jquery - 捕获事件悬停和停留与路过

Question

有没有办法捕获鼠标悬停并停留（一段时间）事件，但如果鼠标经过元素则不行。因此，只有当您悬停并停留时才会触发该事件。

Answer 1

您可以使用setTimeout在执行所需的任何代码之前创建延迟，并clearTimeout在鼠标离开元素时取消计时器：

var timer;
$("#example").mouseover(function() {
    timer = setTimeout(function() {
       console.log("time passed");
    }, 1000); 
}).mouseout(function() {
    clearTimeout(timer);  
});

这是上面的一个工作示例。

Answer 2

在 mouseenter 上，计时器将在 500 毫秒后启动 yourFunction 将被调用
如果用户在您的延迟之前离开，计时器将被清除，因此不会调用该函数。

yourElement.live({
    mouseenter: function() {
        t=setTimeout(function(){ yourFunction() }, 500); 
    }, mouseleave: function() {
        clearTimeout(t);
    }
});

希望这有帮助:)

Answer 3

是的，它有一个插件。我在几乎所有的悬停代码中都使用它：

• jQuery HoverIntent

Answer 4

有专门为此设计的hoverIntent插件。

Answer 5

研究使用 javascript 计时器，当鼠标悬停时开始计数。当鼠标离开时，停止计时器。计时器可以触发一个事件，如果鼠标关闭/离开从未发生，计时器将触发您的悬停/停留功能。

也可能是 JQuery 插件。