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 insertAfter() 实现函数代码
Oct 12 Javascript
jQuery图片轮播的具体实现
Sep 11 Javascript
Jquery插件仿百度搜索关键字自动匹配功能
May 11 Javascript
JavaScript必知必会(十) call apply bind的用法说明
Jun 08 Javascript
BOM系列第一篇之定时器setTimeout和setInterval
Aug 17 Javascript
AngularJS 单元测试(一)详解
Sep 21 Javascript
JavaScript事件用法浅析
Oct 31 Javascript
JS 实现Base64编码与解码实例详解
Nov 07 Javascript
Angular的$http的ajax的请求操作(推荐)
Jan 10 Javascript
angularJS自定义directive之带参方法传递详解
Oct 09 Javascript
用 js 写一个 js 解释器过程详解
Aug 02 Javascript
Javascript实现打鼓效果
Jan 29 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的hash算法介绍
2014/02/13 PHP
CodeIgniter输出中文乱码的两种解决办法
2014/06/12 PHP
推荐十款免费 WordPress 插件
2015/03/24 PHP
PHP使用标准库spl实现的观察者模式示例
2018/08/04 PHP
js 禁用浏览器的后退功能的简单方法
2008/12/10 Javascript
js前台分页显示后端JAVA数据响应
2013/03/18 Javascript
扩展IE中一些不兼容的方法如contains、startWith等等
2014/01/09 Javascript
jQuery 插件开发指南
2014/11/14 Javascript
node.js express安装及示例网站搭建方法(分享)
2016/08/22 Javascript
JavaScript数组操作详解
2017/02/04 Javascript
$.browser.msie 为空或不是对象问题的多种解决方法
2017/03/19 Javascript
用React实现一个完整的TodoList的示例代码
2017/10/30 Javascript
通过fastclick源码分析彻底解决tap“点透”
2017/12/24 Javascript
jQuery zTree搜索-关键字查询 递归无限层功能实现代码
2018/01/25 jQuery
Vue 开发音乐播放器之歌手页右侧快速入口功能
2018/08/08 Javascript
实例详解BootStrap的动态模态框及静态模态框
2018/08/13 Javascript
vue点击页面空白处实现保存功能
2019/11/06 Javascript
vuex刷新后数据丢失的解决方法
2020/10/18 Javascript
jquery自定义组件实例详解
2020/12/31 jQuery
vue自定义组件实现双向绑定
2021/01/13 Vue.js
浅谈Python数据类型判断及列表脚本操作
2016/11/04 Python
python中pandas.DataFrame对行与列求和及添加新行与列示例
2017/03/12 Python
python 同时运行多个程序的实例
2019/01/07 Python
Django学习笔记之为Model添加Action
2019/04/30 Python
pyinstaller打包单个exe后无法执行错误的解决方法
2019/06/21 Python
scrapy数据存储在mysql数据库的两种方式(同步和异步)
2020/02/18 Python
Python实现AI自动抠图实例解析
2020/03/05 Python
python matplotlib包图像配色方案分享
2020/03/14 Python
微信小程序实现可实时改变转速的css3旋转动画实例代码
2018/09/11 HTML / CSS
常用的HTML5列表标签
2017/06/20 HTML / CSS
KIKO MILANO西班牙官网:意大利领先的化妆品和护肤品品牌
2019/05/03 全球购物
汉米尔顿手表官网:Hamilton
2020/09/13 全球购物
公司庆典邀请函范文
2014/01/13 职场文书
中标通知书
2015/04/17 职场文书
MySql重置root密码 --skip-grant-tables
2022/04/11 MySQL
Python实现Matplotlib,Seaborn动态数据图
2022/05/06 Python