javascript – 如何禁用由子元素触发的mouseout事件?

让我详细描述问题:

我想显示一个绝对定位的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() } );
这个问题有点老了,但我在另一天遇到了这个问题。

使用最新版本的jQuery最简单的方法是使用mouseenter和mouseleave事件,而不是mouseover和mouseout。

您可以使用以下快速测试行为:

$(".myClass").on( {
   'mouseenter':function() { console.log("enter"); },
   'mouseleave':function() { console.log("leave"); }
});
http://stackoverflow.com/questions/350639/how-to-disable-mouseout-events-triggered-by-child-elements

本站文章除注明转载外,均为本站原创或编译
转载请明显位置注明出处:javascript – 如何禁用由子元素触发的mouseout事件?