需要帮助的jQuery onmouseout的ul元素的这段代码

Need help with this code on jQuery onmouseout of a ul element

本文关键字：段代码 代码 ul 帮助 jQuery onmouseout 元素      更新时间：2023-09-26

我使用<UL>和<LI>创建了一个导航。在移动出导航<UL>我想做点什么。我所写的代码如下。

请帮助我理解为什么下面的代码在从一个<LI>移动到另一个时被执行，而不仅仅是在离开<UL>时。

<ul id='navigation'>
    <li>a</li>
    <li>b</li>
    <li>c</li>
    <li>d</li>
</ul>
#navigation li
{
   display:inline;
   float:left;   
   width:50px;
   border-right:1px solid black;
   padding:2px;
}
jQuery("#navigation").mouseout(function(){
   alert("hi"); 
});

来自JQuery文档- http://api.jquery.com/mouseout/

此事件类型可能导致许多事件事件冒泡引起的头痛。为实例，当鼠标指针移动时从内部元素中取出例如，将发送一个mouseout事件到那里，然后再到外面。这可以触发绑定的鼠标退出在不合适的时候处理。看到.mouseleave()方法的讨论有用的选择。

请看这个展示mouseout和mouseleave的jsfiddle示例

try mouseleave

mouseleave事件与处理事件的方式冒泡。如果mouseout在这个例子，然后当鼠标指针移出了内部元素，则处理程序为触发。这通常是不可取的的行为。的mouselleave事件另一方面，只触发它的处理程序当鼠标离开该元素时是注定的，不是后裔。因此,在在本例中，触发了处理程序当鼠标离开外部时元素，但不包括Inner元素。

演示

相关文章：