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 相关文章推荐
用js做一个小游戏平台 (一)
Dec 29 Javascript
iframe 上下滚动条如何默认在下方实现原理
Dec 10 Javascript
解决Extjs 4 Panel作为Window组件的子组件时出现双重边框问题
Jan 11 Javascript
js获取事件源及触发该事件的对象
Oct 24 Javascript
js实现表单Radio切换效果的方法
Aug 17 Javascript
函数四种调用模式以及其中的this指向
Jan 16 Javascript
手把手教你vue-cli单页到多页应用的方法
May 31 Javascript
JavaScript跳出循环的三种方法(break, return, continue)
Jul 30 Javascript
深入探索VueJS Scoped CSS 实现原理
Sep 23 Javascript
layui+jquery支持IE8的表格分页方法
Sep 28 jQuery
JS eval代码快速解密实例解析
Apr 23 Javascript
JavaScript高级程序设计之变量与作用域
Nov 17 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
快速开发一个PHP扩展图文教程
2008/12/12 PHP
php中使用Curl、socket、file_get_contents三种方法POST提交数据
2011/08/12 PHP
解析php通过cookies获取远程网页的指定代码
2013/06/25 PHP
php计算两个日期时间差(返回年、月、日)
2014/06/19 PHP
PHP+jQuery 注册模块开发详解
2014/10/14 PHP
jQuery+PHP实现的掷色子抽奖游戏实例
2015/01/04 PHP
PHP数组和explode函数示例总结
2015/05/08 PHP
PHP错误Warning:mysql_query()解决方法
2015/10/24 PHP
PHP中header函数的用法及其注意事项详解
2016/06/13 PHP
PHP实现的随机红包算法示例
2017/08/14 PHP
PHP操作MongoDB实现增删改查功能【附php7操作MongoDB方法】
2018/04/24 PHP
laravel 出现command not found问题的解决方案
2019/10/23 PHP
Node.js插件的正确编写方式
2014/08/03 Javascript
javascript中sort排序实例详解
2016/07/24 Javascript
JS正则匹配URL网址的方法(可匹配www,http开头的一切网址)
2017/01/06 Javascript
通过fastclick源码分析彻底解决tap“点透”
2017/12/24 Javascript
Windows下支持自动更新的Electron应用脚手架的方法
2018/12/24 Javascript
读懂CommonJS的模块加载
2019/04/19 Javascript
el-select 下拉框多选实现全选的实现
2019/08/02 Javascript
解决vue安装less报错Failed to compile with 1 errors的问题
2020/10/22 Javascript
Python列表append和+的区别浅析
2015/02/02 Python
Windows下安装python2.7及科学计算套装
2015/03/05 Python
Python Django简单实现session登录注销过程详解
2019/08/06 Python
pymysql 插入数据 转义处理方式
2020/03/02 Python
Python通过两个dataframe用for循环求笛卡尔积
2020/04/29 Python
Django自带用户认证系统使用方法解析
2020/11/12 Python
VSCODE配置Markdown及Markdown基础语法详解
2021/01/19 Python
高级护理实习生自荐信
2013/09/28 职场文书
新驾驶员个人自我评价
2014/01/03 职场文书
给老婆的搞笑检讨书
2014/01/12 职场文书
社会稳定风险评估方案
2014/06/02 职场文书
党员自我评议个人对照检查材料
2014/09/16 职场文书
教师自查自纠工作情况报告
2014/10/29 职场文书
2014年禁毒工作总结
2014/11/24 职场文书
python自动化操作之动态验证码、滑动验证码的降噪和识别
2021/08/30 Python
Windows Server 2016 配置 IIS 的详细步骤
2022/04/28 Servers