基于mouseout和mouseover等类似事件的冒泡问题解决方法


Posted in Javascript onNovember 18, 2013

最近写点东西,比较闹心,一个弹出层,上边有其他元素,本意是鼠标离开弹出层时,执行一些动作,但在实际应用中,鼠标离开弹出层中的元素时,也会激活这些动作。试了各浏览器的停止事件冒泡的方法,均无效。

还是咱们javaeye里高人众多,在一个哥们博客中发现了如下代码:

  function isMouseLeaveOrEnter(e, handler) {    
        if (e.type != 'mouseout' && e.type != 'mouseover') return false;    
         var reltg = e.relatedTarget ? e.relatedTarget : e.type == 'mouseout' ? e.toElement : e.fromElement;    
         while (reltg && reltg != handler)    
            reltg = reltg.parentNode;    
         return (reltg != handler);    
     }

这个方法是判断,当前元素是不是要执行mouseout事件的元素,这样就可以避免上述问题。
Javascript 相关文章推荐
js的闭包的一个示例说明
Nov 18 Javascript
jqPlot 基于jquery的画图插件
Apr 26 Javascript
JS二维数组的定义说明
Mar 03 Javascript
父页面显示遮罩层弹出半透明状态的dialog
Mar 04 Javascript
Jquery中offset()和position()的区别分析
Feb 05 Javascript
js中获取键盘事件的简单实现方法
Oct 10 Javascript
jquery滚动条插件(可以自定义)
Dec 11 Javascript
JS实现动态修改table及合并单元格的方法示例
Feb 20 Javascript
JavaScript之生成器_动力节点Java学院整理
Jun 30 Javascript
微信小程序实现手势滑动卡片效果
Aug 26 Javascript
vue多页面项目中路由使用history模式的方法
Sep 23 Javascript
el-form 多层级表单的实现示例
Sep 10 Javascript
ExtJS自定义主题(theme)样式详解
Nov 18 #Javascript
设为首页和收藏的Javascript代码(亲测兼容IE,Firefox,chrome等浏览器)
Nov 18 #Javascript
jquery cookie的用法总结
Nov 18 #Javascript
JS JSON对象转为字符串的简单实现方法
Nov 18 #Javascript
javascript获取ckeditor编辑器的值(实现代码)
Nov 18 #Javascript
js 页面元素的几个用法总结
Nov 18 #Javascript
封装的jquery翻页滚动(示例代码)
Nov 18 #Javascript
You might like
php连接mssql数据库的几种方法
2013/02/21 PHP
PHP实现采集抓取淘宝网单个商品信息
2015/01/08 PHP
php版微信公众平台接口参数调试实现判断用户行为的方法
2016/09/23 PHP
PHP弱类型的安全问题详细总结
2016/09/25 PHP
php多文件打包下载的实例代码
2017/07/12 PHP
tp5.1框架数据库子查询操作实例分析
2020/05/26 PHP
js 覆盖和重载 函数
2009/09/25 Javascript
JS 跳转页面延迟2种方法
2013/03/29 Javascript
js 距离某一时间点时间是多少实现代码
2013/10/14 Javascript
解析offsetHeight,clientHeight,scrollHeight之间的区别
2013/11/20 Javascript
JavaScript实现cookie的写入、读取、删除功能
2015/11/05 Javascript
javascript 判断是否是微信浏览器的方法
2016/10/09 Javascript
微信小程序左滑删除效果的实现代码
2017/02/20 Javascript
AngularJS路由实现页面跳转实例
2017/03/03 Javascript
使用Bootstrap和Vue实现用户信息的编辑删除功能
2017/10/25 Javascript
微信小程序定位当前城市的方法
2018/07/19 Javascript
swiper.js插件实现pc端文本上下滑动功能示例
2018/12/03 Javascript
详解Js里的for…in和for…of的用法
2019/03/28 Javascript
jQuery操作事件完整实例分析
2020/01/10 jQuery
微信小程序实现多张图片上传功能
2020/11/18 Javascript
vue3中轻松实现switch功能组件的全过程
2021/01/07 Vue.js
[01:28:44]DOTA2-DPC中国联赛定级赛 RNG vs iG BO3第一场 1月10日
2021/03/11 DOTA
在Python3中使用asyncio库进行快速数据抓取的教程
2015/04/02 Python
Python实现PS滤镜的万花筒效果示例
2018/01/23 Python
Python登录系统界面实现详解
2019/06/25 Python
python/Matplotlib绘制复变函数图像教程
2019/11/21 Python
如何通过python实现IOU计算代码实例
2020/11/02 Python
对pytorch中x = x.view(x.size(0), -1) 的理解说明
2021/03/03 Python
CSS3 box-sizing属性详解
2016/11/15 HTML / CSS
详解CSS3中常用的样式【基本文本和字体样式】
2020/10/20 HTML / CSS
HTML5给汉字加拼音收起展开组件的实现代码
2020/04/08 HTML / CSS
公司承诺书范文
2014/05/19 职场文书
我们的节日重阳节活动总结
2015/03/24 职场文书
2015初中政教处工作总结
2015/07/21 职场文书
小程序实现文字循环滚动动画
2021/06/14 Javascript
阿里面试Nacos配置中心交互模型是push还是pull原理解析
2022/07/23 Java/Android