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 相关文章推荐
Jquery从头学起第四讲 jquery入门教程
Aug 01 Javascript
分享14个很酷的jQuery导航菜单插件
Apr 25 Javascript
基于jQuery的图片剪切插件
Aug 03 Javascript
仿中关村在线首页弹出式广告插件(jQuery版)
May 03 Javascript
JS获取当前日期和时间的简单实例
Nov 19 Javascript
EasyUI闪屏EasyUI页面加载提示(原理+代码+效果图)
Feb 21 Javascript
js实现文字截断功能
Sep 14 Javascript
d3.js入门教程之数据绑定详解
Apr 28 Javascript
原生js+cookie实现购物车功能的方法分析
Dec 21 Javascript
使用Angular Cli如何创建Angular私有库详解
Jan 30 Javascript
小程序和web画三角形实现解析
Sep 02 Javascript
AngularJS实现多级下拉框
Mar 25 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
ADODB结合SMARTY使用~超级强
2006/11/25 PHP
php读取目录所有文件信息dir示例
2014/03/18 PHP
thinkphp获取栏目和文章当前位置的方法
2014/10/29 PHP
php cookie用户登录的详解及实例代码
2017/01/03 PHP
Yii2框架中一些折磨人的坑
2019/12/15 PHP
基于javascript实现判断移动终端浏览器版本信息
2014/12/09 Javascript
js实现文本框支持加减运算的方法
2015/08/19 Javascript
简单谈谈Javascript函数中的arguments
2017/02/09 Javascript
jQuery插件HighCharts绘制的2D堆柱状图效果示例【附demo源码下载】
2017/03/14 Javascript
前端自动化开发之Node.js的环境搭建教程
2017/04/01 Javascript
vuex中的 mapState,mapGetters,mapActions,mapMutations 的使用
2018/04/13 Javascript
JavaScript捕捉事件和阻止冒泡事件实例分析
2018/08/03 Javascript
小程序实现列表删除功能
2018/10/30 Javascript
微信小程序遍历Echarts图表实现多个饼图
2019/04/25 Javascript
Vue动态生成表格的行和列
2019/07/18 Javascript
Vue(定时器)解决mounted不能获取到data中的数据问题
2020/07/30 Javascript
JS实现简易贪吃蛇游戏
2020/08/24 Javascript
vue-router路由懒加载及实现的3种方式
2021/02/28 Vue.js
Centos 升级到python3后pip 无法使用的解决方法
2018/06/12 Python
Python Django框架实现应用添加logging日志操作示例
2019/05/17 Python
安装docker-compose的两种最简方法
2019/07/30 Python
Python 3 判断2个字典相同
2019/08/06 Python
pyenv与virtualenv安装实现python多版本多项目管理
2019/08/17 Python
深入了解python列表(LIST)
2020/06/08 Python
CSS3中的弹性布局em运用入门详解 1em等于多少像素
2021/02/08 HTML / CSS
HTML5里autofocus自动聚焦属性使用介绍
2016/06/22 HTML / CSS
经济实惠的名牌太阳镜和眼镜:Privé Revaux
2021/02/07 全球购物
求职简历中的自我评价分享
2013/12/08 职场文书
家长给幼儿园的表扬信
2014/01/09 职场文书
小学新教师培训方案
2014/02/03 职场文书
团购业务员岗位职责
2014/03/15 职场文书
某集团股份有限公司委托书样本
2014/09/24 职场文书
2015年社区消防安全工作总结
2015/10/14 职场文书
Python数据结构之队列详解
2022/03/21 Python
python垃圾回收机制原理分析
2022/04/13 Python
Java完整实现记事本代码
2022/06/16 Java/Android