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 相关文章推荐
javascript循环变量注册dom事件 之强大的闭包
Sep 08 Javascript
jQuery之$(document).ready()使用介绍
Apr 05 Javascript
Raphael带文本标签可拖动的图形实现代码
Feb 20 Javascript
根据选择不同的下拉值出现相对应的文本输入框
Aug 01 Javascript
jQuery中$.ajax()方法参数解析
Oct 22 Javascript
利用vue写todolist单页应用
Dec 15 Javascript
div实现自适应高度的textarea实现angular双向绑定
Jan 08 Javascript
详解Vue-Cli 异步加载数据的一些注意点
Aug 12 Javascript
JavaScript设计模式之构造函数模式实例教程
Jul 02 Javascript
解决angular双向绑定无效果,ng-model不能正常显示的问题
Oct 02 Javascript
JavaScript判断浏览器版本的方法
Nov 03 Javascript
JavaScript实现Tab标签页切换的最简便方式(4种)
Jun 28 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
用PHP和ACCESS写聊天室(三)
2006/10/09 PHP
破解图片防盗链的代码(asp/php)测试通过
2010/07/02 PHP
php代码架构的八点注意事项
2016/01/25 PHP
PHP封装curl的调用接口及常用函数详解
2018/05/31 PHP
PHP curl批处理及多请求并发实现方法分析
2018/08/15 PHP
javascript 简练的几个函数
2009/08/29 Javascript
用jQuery获取IE9下拉框默认值问题探讨
2013/07/22 Javascript
javascript中怎么做对象的类型判断
2013/11/11 Javascript
JS和函数式语言的三特性
2014/03/05 Javascript
jquery捕捉回车键及获取checkbox值与异步请求的方法
2015/12/24 Javascript
用jQuery获取table中行id和td值的实现代码
2016/05/19 Javascript
细数JavaScript 一个等号,两个等号,三个等号的区别
2016/10/09 Javascript
微信小程序 使用picker封装省市区三级联动实例代码
2016/10/28 Javascript
js实现省市级联效果分享
2017/08/10 Javascript
bootstrap switch开关组件使用方法详解
2017/08/22 Javascript
javascript面向对象三大特征之多态实例详解
2019/07/24 Javascript
解决vant中 tab栏遇到的坑 van-tabs
2020/11/04 Javascript
[54:28]EG vs OG 2019国际邀请赛小组赛 BO2 第一场 8.16
2019/08/18 DOTA
Python实现计算文件夹下.h和.cpp文件的总行数
2015/04/23 Python
python 实现判断ip连通性的方法总结
2018/04/22 Python
解决pyinstaller打包exe文件出现命令窗口一闪而过的问题
2018/10/31 Python
详解python中递归函数
2019/04/16 Python
Python获取好友地区分布及好友性别分布情况代码详解
2019/07/10 Python
python requests模拟登陆github的实现方法
2019/12/26 Python
python与idea的集成的实现
2020/11/20 Python
CSS3 3D位移translate效果实例介绍
2016/05/03 HTML / CSS
澳大利亚体育和露营装备在线/实体零售商:Find Sports
2020/06/03 全球购物
《盲人摸象》教学反思
2014/02/16 职场文书
2014年双拥工作总结
2014/11/21 职场文书
婚礼答谢词
2015/01/04 职场文书
医务人员岗前培训心得体会
2016/01/08 职场文书
小程序教您怎样你零成本推广获取数万用户的方法
2019/07/30 职场文书
mongodb数据库迁移变更的解决方案
2021/09/04 MongoDB
利用Sharding-Jdbc进行分库分表的操作代码
2022/01/22 Java/Android
MybatisPlus EntityWrapper如何自定义SQL
2022/03/22 Java/Android
在ubuntu下安装go开发环境的全过程
2022/08/05 Golang