解决鼠标经过内部元素触发onmouseout事件的问题

最新推荐文章于 2021-05-08 11:44:42 发布

bamboo2016

最新推荐文章于 2021-05-08 11:44:42 发布

阅读量187

点赞数

原文链接：http://www.cnblogs.com/anchao/p/5092170.html

版权

最近在做一个js的效果，发现了一个问题：

当鼠标移入DIV内部的Img或其它元素上时，内部元素的mouseover事件被触发。但是再次将鼠标移动到DIV内部的另一个内部元素时，

却会发现首先被触发的是DIV的mouseout事件，紧接着才是当前这个元素的mouseover事件。

说一个非常简单的解决方法吧：

var ch;
div.onmouseout = function(){
     ch = setTimeOut（"doSomething", 100）;        
}
div.onmouseover = function(){
     clearTimeOut(ch);
}

简单解释一下，由于是当从父元素移到子元素时，先触发的是mouseout事件，然后再触发mouseover事件

抓住这一点，给mouseout设置延迟函数；

如果是上面那种情况（从父元素移动到子元素），触发mouseover事件，清楚延迟函数

第二种情况是真的移出了，从父元素移到它的上层元素，则正常触发doSomething函数

转载于:https://www.cnblogs.com/anchao/p/5092170.html

关注