如何禁用由子元素触发的 mouseout 事件？

小编典典

javascript

让我详细描述一下这个问题：

我想在悬停在元素上时显示绝对定位的 div。使用 jQuery 真的很简单，而且效果很好。但是当鼠标移过其中一个子元素时，它会触发包含 div 的 mouseout 事件。悬停子元素时，如何防止 javascript 触发包含元素的 mouseout 事件。

用 jQuery 做到这一点的最好和最短的方法是什么？

这是一个简化的示例来说明我的意思：

html:

<a>Hover Me</a>
<div>
  <input>Test</input>
  <select>
    <option>Option 1</option>
    <option>Option 2</option>
  </select>
</div>

Javascript/jQuery：

$('a').hover( function() { $(this).next().show() }
              function() { $(this).next().hide() } );

阅读 194

2022-06-30

共1个答案

小编典典

这个问题有点老了，但前几天我遇到了这个问题。

使用最新版本的 jQuery 执行此操作的最简单方法是使用mouseenterandmouseleave事件而不是mouseoverand mouseout。

您可以使用以下方法快速测试行为：

$(".myClass").on( {
   'mouseenter':function() { console.log("enter"); },
   'mouseleave':function() { console.log("leave"); }
});

2022-06-30