基于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在IE和FF下attachEvent,addEventListener学习笔记
Nov 26 Javascript
JavaScript中按位“异或”运算符使用介绍
Mar 14 Javascript
window.returnValue使用方法示例介绍
Jul 03 Javascript
node.js中的url.parse方法使用说明
Dec 10 Javascript
JavaScript中的Math.SQRT1_2属性使用简介
Jun 14 Javascript
微信小程序 页面跳转传参详解
Oct 28 Javascript
vue.js动态数据绑定学习笔记
May 19 Javascript
详谈commonjs模块与es6模块的区别
Oct 18 Javascript
详解webpack引入第三方库的方式以及注意事项
Jan 15 Javascript
微信小程序自定义弹出模态框禁止底部滚动功能
Mar 09 Javascript
JS实现无限轮播无倒退效果
Sep 21 Javascript
微信小程序弹窗禁止页面滚动的实现代码
Dec 30 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程序?
2006/12/08 PHP
PHP关于IE下的iframe跨域导致session丢失问题解决方法
2013/10/10 PHP
浅谈php调用python文件
2019/03/29 PHP
PHP 与 js的通信(via ajax,json)
2010/11/16 Javascript
js实现在页面上弹出蒙板技巧简单实用
2013/04/16 Javascript
jqGrid日期格式的判断示例代码(开始日期与结束日期)
2013/11/08 Javascript
javascript事件模型实例分析
2015/01/30 Javascript
AngularJS基础教程之简单介绍
2015/09/27 Javascript
jQuery+PHP实现可编辑表格字段内容并实时保存
2015/10/09 Javascript
js如何实现淡入淡出效果
2020/11/18 Javascript
js 数据存储和DOM编程
2017/02/09 Javascript
MUI实现上拉加载和下拉刷新效果
2017/06/30 Javascript
Vuex入门到上手教程
2018/06/20 Javascript
详解vue-cli3 中跨域解决方案
2019/04/10 Javascript
vue实现滑动超出指定距离回顶部功能
2019/07/31 Javascript
[44:33]EG vs Liquid 2018国际邀请赛小组赛BO2 第二场 8.18
2018/08/19 DOTA
Python实现的文本对比报告生成工具示例
2018/05/22 Python
解决Python获取字典dict中不存在的值时出错问题
2018/10/17 Python
对Python使用mfcc的两种方式详解
2019/01/09 Python
numpy.linspace函数具体使用详解
2019/05/27 Python
用Python获取摄像头并实时控制人脸的实现示例
2019/07/11 Python
Python 串口通信的实现
2020/09/29 Python
使用numpngw和matplotlib生成png动画的示例代码
2021/01/24 Python
CSS的pointer-events属性详细介绍(作用和注意事项)
2014/04/23 HTML / CSS
方法名是否可以与构造器的名字相同
2012/06/04 面试题
旅游与酒店管理的自我评价分享
2013/11/03 职场文书
战友聚会邀请函
2014/01/18 职场文书
九年级英语教学反思
2014/01/31 职场文书
员工培训邀请函
2014/02/02 职场文书
医学院毕业生自荐信范文
2014/03/06 职场文书
安全协议书范本
2014/04/21 职场文书
教师先进事迹材料
2014/12/16 职场文书
研究生简历自我评
2015/03/11 职场文书
2015年酒店服务员工作总结
2015/05/18 职场文书
财务管理制度范本
2015/08/04 职场文书
2019公司借款合同范本2篇!
2019/07/24 职场文书