Jquery利用mouseenter和mouseleave实现鼠标经过弹出层且可以点击及与mouseout，mouseover的区别

    
    
    
    
    


    

        学习天地
    
    

     
        
            
        
            
        
        
            
        
        
            
            
        
            
            
        
    
凝翠院
飘香楼
凤栖楼
美凤院
春意阁
    

其中注意事项就是，为啥不能用mouseover和mouseout而偏偏应该用mouseenter和mouseleave

下面转载地址：https://blog.csdn.net/cao199408/article/details/70210826

具体看下面两个例子

例子一

mouseover 事件：


mouseenter 事件：

例子一可以发现：当绑定着两个事件的元素里面没有子元素的时候，这两个事件的触发效果是一致的。

 

下面是第二个例子

被触发的 Mouseover 事件：


被触发的 Mouseenter 事件：

通过例子2可以发现：当绑定事件的元素里面有子元素的时候，鼠标经过绑定mouseover的当前元素以及它里面的子元素的时候，都会触发，而经过绑定mouseenter的元素时，只会在鼠标刚进入的时候触发，当进入其子元素的时候，是不会再触发的了。

 

总结两句话

• 不论鼠标指针穿过被选元素或其子元素，都会触发 mouseover 事件。对应mouseout

• 只有在鼠标指针穿过被选元素时，才会触发 mouseenter 事件。对应mouseleave