FireFox JavaScript全局Event对象


Posted in Javascript onJune 14, 2009

而在FireFox中却没有这样的对象,如果有函数嵌套调用,需要不停的向下传递Event,例如下面的场景。

<div style="background-color:Red; width:300px; height:300px;" onclick="Test(event,this);" id="panel"></div> 
function Test(event,dom){ 
Test1(event); 
} 
function Test1(event){ 
Test2(event); 
} 
function Test2(event){ 
alert(event.target.id); 
}

在Test2方法中需要使用event,就需要写成这样。如果在某种场景下,比如添加新功能,需要修改原来的Test2方法,需要访问event对象,而原来Test2方法的签名是Test2(),没有参数event,这时需要修改Test2()为Test2(event) 十分的不美观,虽然JavaScript这样的修改,是方法的重载,但是也破坏了原来的方法签名。
在FireFox中是否有window.event这样的全局变量来获取event?
不幸的是FireFox的对象模型中是没有的,但是可以使用变通的方法取得。例如:
function GetEvent(caller){ 
if(document.all) 
return window.event; //For IE. 
if(caller == null || typeof(caller) != "function") 
return null; 
while(caller.caller != null){ 
caller = caller.caller; 
} 
return caller.arguments[0]; 
}

这里使用document.all判断是否是IE浏览器的做法是不好的,应该使用UserAgent来判断,JQuery等类库中有好的实现。
这样上面的 Test2方法就可以不用修改方法签名了:
function Test2(){ 
var event = GetEvent(Test2); 
alert(GetEventTarget(event).id); 
} 
function GetEventTarget(event){ 
if(document.all) 
return event.srcElement; 
return event.target; 
}

为什么可以写出GetEvent方法,取得Event?
因为在Firefox的事件模型中最初的事件调用是将event显示的传递给方法的,所以可以写出GetEvent方法,取得唤起JavaScript的event。
FireFox JavaScript全局Event对象
Javascript 相关文章推荐
js 获取中文拼音,Select自动匹配字母获取值的代码
Sep 23 Javascript
JavaScript 学习笔记(十一)
Jan 19 Javascript
让复选框只能选择一项的方法
Oct 08 Javascript
JQuery验证jsp页面属性是否为空(实例代码)
Nov 08 Javascript
js实现正则匹配中文标点符号的方法
Dec 23 Javascript
jQuery滑动到底部加载下一页数据的实例代码
May 22 jQuery
JS通过调用微信API实现微信支付功能的方法示例
Jun 29 Javascript
详解在WebStorm中添加Vue.js单文件组件的高亮及语法支持
Oct 21 Javascript
vue技术分享之你可能不知道的7个秘密
Apr 09 Javascript
ES6 let和const定义变量与常量的应用实例分析
Jun 27 Javascript
使用Vue实现调用接口加载页面初始数据
Oct 28 Javascript
vue中 数字相加为字串转化为数值的例子
Nov 07 Javascript
Javascript 错误处理的几种方法
Jun 13 #Javascript
Javascript 学习书 推荐
Jun 13 #Javascript
javascript 框架小结 个人工作经验
Jun 13 #Javascript
动态刷新 dorado树的js代码
Jun 12 #Javascript
firefo xml 读写实现js代码
Jun 11 #Javascript
犀利的js 函数集合
Jun 11 #Javascript
js 操作css实现代码
Jun 11 #Javascript
You might like
ThinkPHP分组下自定义标签库实例
2014/11/01 PHP
PHP实现的下载远程文件类定义与用法示例
2017/07/05 PHP
Laravel 5.5基于内置的Auth模块实现前后台登陆详解
2017/12/21 PHP
JavaScript中判断函数是new还是()调用的区别说明
2011/04/07 Javascript
jQuery实现当按下回车键时绑定点击事件
2014/01/28 Javascript
JQuery 控制内容长度超出规定长度显示省略号
2014/05/23 Javascript
JQuery实现动态适时改变字体颜色的方法
2015/03/10 Javascript
JS实现仿QQ聊天窗口抖动特效
2015/05/10 Javascript
Javascript获取统一管理的提示语(message)
2016/02/03 Javascript
d3.js中冷门却实用的内置函数总结
2017/02/04 Javascript
JS触摸与手势事件详解
2017/05/09 Javascript
nodejs Assert中equal(),strictEqual(),deepEqual(),strictDeepEqual()比较
2017/09/18 NodeJs
ionic3双击返回退出应用的方法
2019/09/17 Javascript
js实现div色块碰撞
2020/01/16 Javascript
js实现飞机大战小游戏
2020/08/26 Javascript
在Python程序和Flask框架中使用SQLAlchemy的教程
2016/06/06 Python
在 Python 应用中使用 MongoDB的方法
2017/01/05 Python
Python解惑之True和False详解
2017/04/24 Python
Python 3.x读写csv文件中数字的方法示例
2017/08/29 Python
django中使用Celery 布式任务队列过程详解
2019/07/29 Python
如何基于python操作excel并获取内容
2019/12/24 Python
浅谈Pycharm最有必要改的几个默认设置项
2020/02/14 Python
浅谈Pytorch torch.optim优化器个性化的使用
2020/02/20 Python
python语言是免费还是收费的?
2020/06/15 Python
一文轻松掌握python语言命名规范规则
2020/06/18 Python
Python通过len函数返回对象长度
2020/10/22 Python
css3实现信纸/同学录效果的示例代码
2018/12/11 HTML / CSS
Html5实现首页动态视频背景的示例代码
2019/09/25 HTML / CSS
教师的实习自我鉴定
2013/12/17 职场文书
小学教研工作制度
2014/01/15 职场文书
妇女干部培训方案
2014/05/12 职场文书
2015世界地球日活动总结
2015/02/09 职场文书
机关工会工作总结2015
2015/05/26 职场文书
在校学生证明格式
2015/06/24 职场文书
毕业生就业推荐表自我鉴定
2019/06/20 职场文书
MySQL令人咋舌的隐式转换
2021/04/05 MySQL