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 定义初始化数组函数
Sep 07 Javascript
JSDoc 介绍使用规范JsDoc的使用介绍
Feb 12 Javascript
jquery实现的导航固定效果
Apr 28 Javascript
JavaScript中操作字符串之localeCompare()方法的使用
Jun 06 Javascript
Javascript数组Array基础介绍
Mar 13 Javascript
更靠谱的H5横竖屏检测方法(js代码)
Sep 13 Javascript
Js实现京东无延迟菜单效果实例(demo)
Jun 02 Javascript
微信小程序之滚动视图容器的实现方法
Sep 26 Javascript
vue2.0 better-scroll 实现移动端滑动的示例代码
Jan 25 Javascript
JS实现点击拉拽轮播图pc端移动端适配
Sep 05 Javascript
用jQuery将JavaScript对象转换为querystring查询字符串的方法
Nov 12 jQuery
详解JavaScript 作用域
Jul 14 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之短标签开启设置
2013/06/17 PHP
解析php中session的实现原理以及大网站应用应注意的问题
2013/06/17 PHP
PHP实现加强版加密解密类实例
2015/07/29 PHP
javascript实现的基于金山词霸网络翻译的代码
2010/01/15 Javascript
js 链式延迟执行DOME
2012/01/04 Javascript
Extjs中使用extend(js继承) 的代码
2012/03/15 Javascript
jquery 实现input输入什么div图层显示什么
2014/06/15 Javascript
jQuery实现固定在网页顶部的菜单效果代码
2015/09/02 Javascript
jQuery实现带玻璃流光质感的手风琴特效
2015/11/20 Javascript
简介AngularJS中$http服务的用法
2016/02/06 Javascript
AngularJS基础 ng-dblclick 指令用法
2016/08/01 Javascript
jquery.tableSort.js表格排序插件使用方法详解
2020/08/12 Javascript
node简单实现一个更改头像功能的示例
2017/12/29 Javascript
JavaScript递归函数解“汉诺塔”算法代码解析
2018/07/05 Javascript
angularjs1.X 重构controller 的方法小结
2019/08/15 Javascript
Vue watch响应数据实现方法解析
2020/07/10 Javascript
vue 路由meta 设置导航隐藏与显示功能的示例代码
2020/09/04 Javascript
vue中h5端打开app(判断是安卓还是苹果)
2021/02/26 Vue.js
使用优化器来提升Python程序的执行效率的教程
2015/04/02 Python
python简单实现旋转图片的方法
2015/05/30 Python
Python线程详解
2015/06/24 Python
Python基于socket实现简单的即时通讯功能示例
2018/01/16 Python
利用python实现对web服务器的目录探测的方法
2019/02/26 Python
Python实现的文轩网爬虫完整示例
2019/05/16 Python
深入浅析Python 函数注解与匿名函数
2020/02/24 Python
django 模型中的计算字段实例
2020/05/19 Python
Python应用自动化部署工具Fabric原理及使用解析
2020/11/30 Python
matplotlib运行时配置(Runtime Configuration,rc)参数rcParams解析
2021/01/05 Python
Javascript 高级手势使用介绍
2013/04/21 HTML / CSS
Java程序员面试题
2016/09/27 面试题
2014年教师节演讲稿范文
2014/09/10 职场文书
个人务虚会发言材料
2014/10/20 职场文书
Python并发编程实例教程之线程的玩法
2021/06/20 Python
redis使用不当导致应用卡死bug的过程解析
2021/07/01 Redis
JS setTimeout与setInterval的区别
2022/04/20 Javascript
戴尔Win11系统no bootable devices found解决教程
2022/09/23 数码科技