jquery - 具有扩展文本、扩展问题的面板

Question

以下脚本显示/展开一些文本，如果您将鼠标悬停在黑色空间的顶部和底部，则效果很好，问题是如果您将鼠标悬停在文本出现的区域上，您会得到奇怪的跳跃效果，例如快速关闭然后重新打开。

Fiddle

$(document).ready(function () {
$(".eaRes").mouseover(function () {
    $(this).find(".expandres").stop().slideDown("fast");
});
$(".eaRes").mouseout(function () {
    $(this).find(".expandres").slideUp("fast");
});
});

Answer 1

您希望使用 mouseenter 而不是 mouseover，并使用 mouseleave 而不是 mouseout。

除了父元素之外，每当进入或退出子元素时，mouseover 和 mouseout 事件都会触发。这意味着该事件的触发频率比您想象的要高，从而导致奇怪的“跳跃”行为。

相比之下，mouseenter 和 mouseleave 仅在进入或退出父元素时才会触发。

这是一个fork of your fiddle随着变化。