jquery - 奇怪的 jQuery 悬停行为

Question

我现在花了一段时间阅读有关 jQuery 悬停问题的各种其他帖子，并尝试了不同的方法来让我的 jQuery 悬停功能正常工作，但没有成功。

我想要实现的目标

我想使用 jQuery 的悬停事件隐藏/显示 li 元素中的 div。

发生了什么

div 隐藏/显示正确，但如果鼠标从一个 li 元素快速移动到下一个元素，有时隐藏(mouseleave)似乎没有被执行。这使得原本应该隐藏的 div 变得可见。

演示

http://jsfiddle.net/vJPNT/11/

在演示中，您将看到这种效果。当鼠标滑过 li 元素时，会出现一个包含链接“Delete”的 div，但如果鼠标快速跳到下一个 li 元素，它并不总是消失。

如果需要任何额外信息，请告诉我。谢谢。

Answer 1

我将 console.log($(e.target)) 添加到您的两个函数中。有时 e.target 似乎是 li 元素内的 div 之一。这可能是因为您捕获了传播的悬停事件。

通过将 $(e.target) 更改为 $(this) 你应该没问题。

function updateIn(e) {
    $(this).find('.actions').show();                
    console.log($(e.target));
}

function updateOut(e) {
    $(this).find('.actions').hide();  
    console.log($(e.target));
}

$('li.update').hover(updateIn, updateOut);
$('li.update .actions').hide();