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网页版计算器的简单实现
Jul 02 Javascript
js鼠标及对象坐标控制属性详细解析
Dec 14 Javascript
全面解析Bootstrap中scrollspy(滚动监听)的使用方法
Jun 06 Javascript
详解XMLHttpRequest(二)响应属性、二进制数据、监测上传下载进度
Sep 14 Javascript
动态JavaScript所造成一些你不知道的危害
Sep 25 Javascript
AngularJS实现页面跳转后自动弹出对话框实例代码
Aug 02 Javascript
js中的深浅拷贝问题简析
May 10 Javascript
Node.JS在命令行中检查Chrome浏览器是否安装并打开指定网址
May 21 Javascript
vue 实现动态路由的方法
Jul 06 Javascript
VUE UPLOAD 通过ACTION返回上传结果操作
Sep 07 Javascript
js前端对于大量数据的展示方式及处理方法
Dec 02 Javascript
vue-cropper组件实现图片切割上传
May 27 Vue.js
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
与空气斗智斗勇的经典《Overlord》,传说中的“无稽之谈”
2020/04/09 日漫
php面向对象的方法重载两种版本比较
2008/09/08 PHP
在PHP中利用wsdl创建标准webservice的实现代码
2011/12/07 PHP
php的mkdir()函数创建文件夹比较安全的权限设置方法
2014/07/28 PHP
浅析THINKPHP的addAll支持的最大数据量
2015/02/03 PHP
键盘控制事件应用教程大全
2006/11/24 Javascript
用jquery的方法制作一个简单的导航栏
2014/06/23 Javascript
jQuery多媒体插件jQuery Media Plugin使用详解
2014/12/19 Javascript
javascript的日期对象、数组对象、二维数组使用说明
2014/12/22 Javascript
javascript笛卡尔积算法实现方法
2015/04/08 Javascript
浅谈node.js中async异步编程
2015/10/22 Javascript
jQuery实现的鼠标滑过弹出放大图片特效
2016/01/08 Javascript
实用又漂亮的BootstrapValidator表单验证插件
2016/05/30 Javascript
深入浅析JavaScript中的Function类型
2016/07/09 Javascript
获取JS中网页各种高宽与位置的方法总结
2016/07/27 Javascript
AngularJS之依赖注入模拟实现
2016/08/19 Javascript
Vue.js 2.0 移动端拍照压缩图片预览及上传实例
2017/04/27 Javascript
jquery中ajax请求后台数据成功后既不执行success也不执行error的完美解决方法
2017/12/24 jQuery
node实现生成带参数的小程序二维码并保存到本地功能示例
2018/12/05 Javascript
jQuery实现手风琴效果(蒙版)
2020/01/11 jQuery
js实现抽奖的两种方法
2020/03/19 Javascript
JavaScript常用8种数组去重代码实例
2020/09/09 Javascript
python中的yield使用方法
2014/02/11 Python
Python实现修改文件内容的方法分析
2018/03/25 Python
python实现简单http服务器功能
2018/09/17 Python
Win10下python 2.7.13 安装配置方法图文教程
2018/09/18 Python
python and or用法详解
2019/06/26 Python
解决redis与Python交互取出来的是bytes类型的问题
2020/07/16 Python
python实现图片,视频人脸识别(opencv版)
2020/11/18 Python
cookies应对python反爬虫知识点详解
2020/11/25 Python
详解如何用HTML5 Canvas API控制图片的缩放变换
2016/03/22 HTML / CSS
小学敬老月活动方案
2014/02/11 职场文书
怎么写好自荐书
2014/03/02 职场文书
优秀学生党员先进事迹材料
2014/05/29 职场文书
建筑质检员岗位职责
2015/04/08 职场文书
2015年国庆节演讲稿范文
2015/07/30 职场文书