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

我使用< 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/

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.

标签：javascript,jquery,html-lists
来源： https://codeday.me/bug/20190723/1516493.html