Javascript 需要关于jQuery onmouseout的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"); 

});


a
b
c
d

#导航李
{
显示：内联；
浮动：左；
宽度：50px；
右边框：1px纯黑；
填充：2px；
}
jQuery（“#导航”）.mouseout（函数（）{
警报（“hi”）；
});
来自JQuery文档-

此事件类型可能会导致许多错误
因事件冒泡引起的头痛。对于
实例，当鼠标指针移动时
在这里面的内部元素之外
例如，将发送mouseout事件
到那，然后慢慢流到外面。
这可能会触发绑定的mouseout
在不合适的时候处理。见
关于.mouseleave（）的讨论
有用的替代方案

请参见“显示并重试”。

mouseleave事件与
它处理事件的方式中的鼠标移出
冒泡。如果用老鼠屎
这个例子，当鼠标
指针移出内部
元素，则处理程序将是
触发。这通常是不可取的
行为。鼠标移动事件，在
另一方面，仅触发其处理程序
当鼠标离开元素时，它将
是注定的，不是后代。所以在
在本例中，将触发处理程序
当鼠标离开外壳时
元素，但不是内部元素