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 相关文章推荐
FF(火狐)浏览器无法执行window.close()解决方案
Nov 13 Javascript
EasyUI中实现form表单提交的示例分享
Mar 01 Javascript
JS实现浏览器状态栏文字闪烁效果的方法
Oct 27 Javascript
使用Bootstrap typeahead插件实现搜索框自动补全的方法
Jul 07 Javascript
基于JS如何实现给字符加千分符(65,541,694,158)
Aug 03 Javascript
用jquery获取自定义的标签属性的值简单实例
Sep 17 Javascript
Bootstrap 模态框(Modal)插件代码解析
Dec 21 Javascript
vue-dialog的弹出层组件
May 25 Javascript
详解AngularJS用Interceptors来统一处理HTTP请求和响应
Jun 08 Javascript
JavaScript实现多叉树的递归遍历和非递归遍历算法操作示例
Feb 08 Javascript
微信小程序地图实现展示线路
Jul 29 Javascript
vue实现轮播图帧率播放
Jan 26 Vue.js
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
解析PHP正则提取或替换img标记属性
2013/06/26 PHP
php数组删除元素示例
2014/03/21 PHP
如何解决phpmyadmin导入数据库文件最大限制2048KB
2015/10/09 PHP
浅谈PHP检查数组中是否存在某个值 in_array 函数
2016/06/13 PHP
php7基于递归实现删除空文件夹的方法示例
2017/06/15 PHP
PHP创建XML接口示例
2019/07/04 PHP
thinkphp5.1框架实现格式化mysql时间戳为日期的方式小结
2019/10/10 PHP
Apache站点配置SSL强制跳转443
2021/03/09 Servers
11款基于Javascript的文件管理器
2009/10/25 Javascript
基于jQuery实现返回顶部实例代码
2016/01/01 Javascript
jquery插件autocomplete用法示例
2016/07/01 Javascript
jQuery图片加载显示loading效果
2016/11/04 Javascript
微信小程序实现实时圆形进度条的方法示例
2017/02/24 Javascript
Angularjs根据json文件动态生成路由状态的实现方法
2017/04/17 Javascript
laydate 显示结束时间不小于开始时间的实例
2017/08/11 Javascript
layui实现文件或图片上传记录
2018/08/28 Javascript
layui导出所有数据的例子
2019/09/10 Javascript
element实现合并单元格通用方法
2019/11/13 Javascript
如何在selenium中使用js实现定位
2020/08/18 Javascript
vue 项目引入echarts 添加点击事件操作
2020/09/09 Javascript
[01:14:34]DOTA2上海特级锦标赛C组资格赛#2 LGD VS Newbee第一局
2016/02/28 DOTA
在Python中用get()方法获取字典键值的教程
2015/05/21 Python
python动态网页批量爬取
2016/02/14 Python
Python中str is not callable问题详解及解决办法
2017/02/10 Python
Python爬虫中urllib库的进阶学习
2018/01/05 Python
对pytorch的函数中的group参数的作用介绍
2020/02/18 Python
numpy矩阵数值太多不能全部显示的解决
2020/05/14 Python
伦敦哈德森鞋:Hudson Shoes
2018/02/06 全球购物
大专生自我鉴定范文
2013/10/01 职场文书
学生个人的自我评价分享
2013/11/05 职场文书
初中毕业生的自我评价
2014/03/03 职场文书
法定代表人身份证明书
2014/09/10 职场文书
开展警示教育活动总结
2015/05/09 职场文书
优秀新员工事迹材料
2019/05/13 职场文书
如何让2019年上半年的工作总结更出色!
2019/07/01 职场文书
python numpy中multiply与*及matul 的区别说明
2021/05/26 Python