javascript - 在 ul 元素的 jQuery onmouseout 上需要有关此代码的帮助

Question

我使用 <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"); 

});

Answer 1

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

This event type can cause many headaches due to event bubbling. For instance, when the mouse pointer moves out of the Inner element in this example, a mouseout event will be sent to that, then trickle up to Outer. This can trigger the bound mouseout handler at inopportune times. See the discussion for .mouseleave() for a useful alternative.

参见 this jsfiddle example显示mouseout和 mouseleave .