关于mouseleave事件触发的bug问题

在做下拉树搜索功能的时候，下方内容框需要一个鼠标移出时就隐藏的功能，于是使用mouseleave的方法， 但是出现了一个问题就是在点击树展开个隐藏的时候，也触发了leave事件，将下方的树进行隐藏，出现了不好的用户体验

问题原因：

　　就是因为leave事件存在一个bug问题，如果绑定外层div里面还存在div，当鼠标离开内层div的时候同样的会触发mouseleave的事件，如果里面存在多个div，离开每一个的时候都会触发一次leave事件，

解决办法：

　　大致意思就是在触发了mouseleave事件的延时判断鼠标是不是还在menuContent内，如果在就不执行隐藏方法，如果不在就隐藏

附上代码：

var Timer1;
$("#menuContent").mouseleave(function(){
    Timer1=setTimeout(function(){
        hideMenu();
    })
})
$("#menuContent").mouseover(function(){
    window.clearTimeout(Timer1);
})

 

转载于:https://www.cnblogs.com/pengfei25/p/8275860.html