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获取table中某一列的值的方法
May 06 Javascript
jQuery实现的导航条切换可显示隐藏
Oct 22 Javascript
JavaScript获取URL汇总
Jun 08 Javascript
JS中的二叉树遍历详解
Mar 18 Javascript
微信小程序中使元素占满整个屏幕高度实现方法
Dec 14 Javascript
微信小程序 跳转传参数与传对象详解及实例代码
Mar 14 Javascript
在Vue中使用Compass的方法
Mar 02 Javascript
详解React中传入组件的props改变时更新组件的几种实现方法
Sep 13 Javascript
20个必会的JavaScript面试题(小结)
Jul 02 Javascript
Vue 刷新当前路由的实现代码
Sep 26 Javascript
JavaScript的垃圾回收机制与内存管理
Aug 06 Javascript
微前端qiankun改造日渐庞大的项目教程
Jun 21 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错误日志的获取方法
2015/07/20 PHP
PHP封装CURL扩展类实例
2015/07/28 PHP
Zend Framework教程之视图组件Zend_View用法详解
2016/03/05 PHP
Yii框架批量插入数据扩展类的简单实现方法
2017/05/23 PHP
php empty 函数判断结果为空但实际值却为非空的原因解析
2018/05/28 PHP
Laravel5.1框架路由分组用法实例分析
2020/01/04 PHP
js与jquery中获取当前鼠标的x、y坐标位置的代码
2011/05/23 Javascript
js自定义方法通过隐藏iframe实现文件下载
2013/02/21 Javascript
通过JQuery将DIV的滚动条滚动到指定的位置方便自动定位
2014/05/05 Javascript
JS实现文档加载完成后执行代码
2015/07/09 Javascript
详解vue 中使用 AJAX获取数据的方法
2017/01/18 Javascript
Spring shiro + bootstrap + jquery.validate 实现登录、注册功能
2017/06/02 jQuery
详解react-router4 异步加载路由两种方法
2017/09/12 Javascript
js数组常用最重要的方法
2018/02/04 Javascript
layui点击按钮添加可编辑的一行方法
2018/08/15 Javascript
vue实现前台列表数据过滤搜索、分页效果
2019/05/28 Javascript
nodejs和react实现即时通讯简易聊天室功能
2019/08/21 NodeJs
关于vue属性使用和不使用冒号的区别说明
2020/10/22 Javascript
[01:25]2015国际邀请赛最佳短片奖——斧王《拆塔英雄:天赋异禀》
2015/09/22 DOTA
python图像处理之反色实现方法
2015/05/30 Python
Python随手笔记之标准类型内建函数
2015/12/02 Python
在CentOS上配置Nginx+Gunicorn+Python+Flask环境的教程
2016/06/07 Python
django创建自定义模板处理器的实例详解
2017/08/14 Python
python实现自动解数独小程序
2019/01/21 Python
python实现坦克大战游戏 附详细注释
2020/03/27 Python
python异常处理和日志处理方式
2019/12/24 Python
6号汽车旅馆预订:Motel 6
2018/02/11 全球购物
便利店投资创业计划书
2014/02/08 职场文书
投标担保书范文
2014/04/02 职场文书
《欢乐的泼水节》教学反思
2014/04/22 职场文书
住宅质量保证书
2014/04/29 职场文书
服务理念口号
2014/06/11 职场文书
卡特教练观后感
2015/06/08 职场文书
《群青的幻想曲》京力秋树角色PV公开
2022/04/08 日漫
华为HarmonyOS3.0强在哪? 看看鸿蒙3.0这7个小功能
2023/01/09 数码科技