js的mouseout和mouseover事件

• mouseover事件
• mouseout和mouseleave事件
• 例子

mouseover事件

mouseover在滑鼠停留在某個元素時觸發，有點類似與hover

mouseout和mouseleave事件

   mouseout 與 mouseleave 事件不同，不論滑鼠指標離開被選元素還是任何子元素，都會觸發 mouseout 事件。只有在滑鼠指標離開被選元素時，才會觸發 mouseleave 事件。

例子

  <div class="header-right">
        <a i18n="myOrder_person" id="private_person" class="private_person" onmouseover="personCenter_show()" >個人中心</a>
        <ul id="private_person_list" onmouseleave="personCenter_hide()" >
            <li i18n="myOrder_order">我的訂單</li>
            <li i18n="myOrder_interests">我的權益</li>
        </ul>
   </div>
 

樣式如下：

當滑鼠經過倆個< li >元素的中間間隔時，無論時mouseout,還是mouseleave都是會被觸發的，因為已經離開了事件指向的元素！
我們可以將< li >元素的中間空隙用border填充，使用mouseleave事件，則可以在ul列表中停留，不會觸發mouseleave事件，只有當滑鼠離開了ul元素才會觸發。