mouseover和mouseout闪烁问题

在父级元素上注册了mouseover和mouseout事件后，当鼠标移动到子元素上时，会触发父级的mouseout和mouseover事件，反复触发，形成闪烁。

原因: 一种是由于冒泡，子级的mouseover和mouseout触发了父级的mouseover和mouseout，一种是不明原因，也会造成这个现象。

解决方法：

1. setTimeout，类似于debounce处理

$('div').mouseout(function(){
      clearTimeout(t);
      t=setTimeout(zoomIn,400);
}).mouseover(function(){
      if(t!=null)clearTimeout(t);
      t=null;
}
);

2.使用jquery的mouseenter和mouseleave代替，或者使用jquery的hover方法来处理。hover方法是对mouseenter和mouseleave的封装，而mouseenter和mouseleave则是对mouseover和mouseout的封装，进行了srcElement的判断，忽略子元素的行为。

转载于:https://www.cnblogs.com/mengff/p/4993788.html