js 事件处理函数间的Event物件是否全等


Posted in Javascript onApril 08, 2011

这个小问题以前就遇到,却没有去总结
现在又遇到,为了得到准确结论,记录下来:
如题:同一事件 多个执行函数间的Event物件是否全等

例如:

dom.addEvent('click',fna); 
dom.addEvent('click',fnb);

1:在fna里对Event物件添加的属性,在其后执行的fnb函数里是对于Event物件是否能访问到?
2:执行fna/fnb函数时的Event物件是否全等 Eventfna===Eventfnb ?

标准的文档太长哪里是说明了这里的规则呢?懒吧...

对于Jquery,同一事件,多个执行函数间的Event物件是全等的。
Jquery live绑定事件的实现里,对于可能会被重复执行的函数liveHandler,依靠额外给Event物件的liveFired属性,使得在第一次之后执行的liveHandler 的开始 即退出函数:

if (event.liveFired === this || ...) { 
return; 
} 
///.... 
event.liveFired = this;

测试:
function a(e) { 
e.abc = function() { 
alert(a); 
}; 
prevEvent = e; 
prevIeEvent=window.event; 
} 
function b(e,event) { 
e.abc(); //fn 
alert(e === prevEvent); //true 
if(event=window.event){ 
alert(event===e); //false 
alert(event===prevIeEvent);//false 
alert(event===prevEvent);//false 
} 
} 
var t = document.getElementById("p"); 
if (t.addEventListener) { 
t.addEventListener('click', a, false); 
t.addEventListener('click', b, false) 
} else { 
t.attachEvent('onclick', b); 
t.attachEvent('onclick', a) 
}

对于原生绑定事件方式[addEventListener,attachEvent],对于多个执行函数间的Event物件(通过参数传递的event)是全等的,在IE里,通过window.event形式得到的Event物件不全等。与通过参数传递的Event也不全等。
对于冒泡事件:
dom.addEvent('click',fna); 
domParentNode.addEvent('click',fnb);

jquery里,在以trigger形式触发事件时,冒泡事件之间的函数中的Event物件是全等的。而实际用户行为触发的事件,则不是同一物件。自定义属性也传递不了。取值设置都都没有影响真正的originalEvent。
以原生绑定事件方式[addEventListener,attachEvent]:
function a(e) { 
e.abc = function() { 
alert(a); 
}; 
prevEvent = e; 
prevIeEvent=window.event; 
} 
function b(e,event) { 
alert(e.abc); //fn 
alert(e === prevEvent); //true 
if(event=window.event){ 
alert(event===e); //false 
alert(event===prevIeEvent);//false 
alert(event===prevEvent);//false 
} 
} 
var t = document.getElementById("p"); 
if (t.addEventListener) { 
t.addEventListener('click', a, false); 
document.body.addEventListener('click', b, false); 
} else { 
t.attachEvent('onclick', a); 
document.body.attachEvent('onclick', b); 
}

结果是attachEvent绑定事件时IE中冒泡事件之间的函数内Event物件不一致。FF等 以addEventListener 则全等对象。
事实上,在非IE,事件对象Propagation之间的处理函数,或同dom节点触发的多个函数之间的Event物件是全等的。与绑定形式[addEventListener/DOM0]无关。
而在IE,仅同dom节点触发的多个函数之间的通过参数传递的Event物件(attachEvent)是全等的。
Javascript 相关文章推荐
jquery判断浏览器类型的代码
Nov 05 Javascript
JavaScript html5 canvas绘制时钟效果
Mar 01 Javascript
vue项目中做编辑功能传递数据时遇到问题的解决方法
Dec 19 Javascript
JavaScript中匿名函数的递归调用
Jan 22 Javascript
详解在Angularjs中ui-sref和$state.go如何传递参数
Apr 24 Javascript
全面解析Node.js 8 重要功能和修复
Jun 02 Javascript
在React中如何优雅的处理事件响应详解
Jul 24 Javascript
使用vue打包时vendor文件过大或者是app.js文件很大的问题
Jun 29 Javascript
详解Vue项目部署遇到的问题及解决方案
Jan 11 Javascript
小程序:授权、登录、session_key、unionId的详解
May 15 Javascript
让 babel webpack vue 配置文件支持智能提示的方法
Jun 22 Javascript
微信小程序学习总结(二)样式、属性、模板操作分析
Jun 04 Javascript
Javascript 八进制转义字符(8进制)
Apr 08 #Javascript
JavaScript中判断函数是new还是()调用的区别说明
Apr 07 #Javascript
JavaScript中清空数组的三种方法分享
Apr 07 #Javascript
使用滤镜设置透明导致 IE 6/7/8/9 解析异常的解决方法
Apr 07 #Javascript
javascript各浏览器中option元素的表现差异
Apr 07 #Javascript
IE6/7/8中Option元素未设value时Select将获取空字符串
Apr 07 #Javascript
我的javascript 函数链之演变
Apr 07 #Javascript
You might like
杏林同学录(六)
2006/10/09 PHP
C#静态方法与非静态方法实例分析
2014/09/22 PHP
php中print(),print_r(),echo()的区别详解
2014/12/01 PHP
PHP判断网络文件是否存在的方法
2015/03/12 PHP
JQuery 写的个性导航菜单
2009/12/24 Javascript
基于jquery的让页面控件不可用的实现代码
2010/04/27 Javascript
JS图片浏览组件PhotoLook的公开属性方法介绍和进阶实例代码
2010/11/09 Javascript
初窥JQuery(二) 事件机制(1)
2010/11/25 Javascript
javascript闭包传参和事件的循环绑定示例探讨
2014/04/17 Javascript
js创建一个input数组并绑定click事件的方法
2014/06/12 Javascript
jQuery事件绑定与解除绑定实现方法
2015/04/15 Javascript
JavaScript+html5 canvas绘制的小人效果
2016/01/27 Javascript
关于BootStrap modal 在IOS9中不能弹出的解决方法(IOS 9 bootstrap modal ios 9 noticework)
2016/12/14 Javascript
jQuery.parseHTML() 函数详解
2017/01/09 Javascript
iOS + node.js使用Socket.IO框架进行实时通信示例
2017/04/14 Javascript
微信小程序之数据缓存的实例详解
2017/09/29 Javascript
浅谈React深度编程之受控组件与非受控组件
2017/12/26 Javascript
js之切换全屏和退出全屏实现代码实例
2019/09/09 Javascript
vue 实现路由跳转时更改页面title
2019/11/05 Javascript
element el-table表格的二次封装实现(附表格高度自适应)
2021/01/19 Javascript
[37:45]完美世界DOTA2联赛PWL S3 LBZS vs Phoenix 第二场 12.09
2020/12/11 DOTA
python实现换位加密算法的示例
2018/10/14 Python
Python自动创建Excel并获取内容
2020/09/16 Python
python 制作网站筛选工具(附源码)
2021/01/21 Python
.net工程师笔试题
2012/06/09 面试题
大学生文员专业个人求职信范文
2014/01/05 职场文书
五年级数学教学反思
2014/02/11 职场文书
租房协议书范本
2014/04/09 职场文书
机关门卫的岗位职责
2014/04/29 职场文书
工厂搬迁方案
2014/05/11 职场文书
施工安全生产承诺书
2014/05/23 职场文书
党员个人剖析材料(四风问题)
2014/10/07 职场文书
矛盾论读书笔记
2015/06/29 职场文书
学校教师培训工作总结
2015/10/14 职场文书
MySQL系列之十一 日志记录
2021/07/02 MySQL
python中字符串String及其常见操作指南(方法、函数)
2022/04/06 Python