window.event
e = e || window.event是我们在做事件处理时候区分IE和其他浏览器事件对象时常用的写法。但是这行兼容性代码有没有必要出现在所有的事件句柄中呢？标准事件调用方式需要这行代码吗？下边我们做详细讨论。
在讨论之前，如果有些忘记或者不熟悉事件对象的先参考其他资料，或者看看这个连接的资料http://wenku.baidu.com/view/400a89f4f61fb7360b4c65ca.html
这里作者把四种主要的事件调用方式总结了出来，本文的讨论也是在此之上延伸说明。
<!DOCTYPE HTML>
<html>
<head>
<title></title>
<style type="text/css">
#aa{ border:1px solid #000; width:100px; height:40px; margin-top:50px;}
#bb{ border:1px solid #000; width:500px; height:40px; margin-top:50px;}
#cc{ border:1px solid #000; width:500px; height:40px;}
</style>
</head>
<body>
<div id="aa"></div>
<div id="bb">dfdfddfsd</div>
<div id="cc">gregreger</div> <script type="text/javascript"> document.getElementById("aa").onclick = function (e) {
if (e) alert(e.toString()); // IE6/7/8 e为undefined IE9中e为W3标准事件对象。
//e = window.event;
alert(e.srcElement.tagName || e.currentTarget.tagName);
}
/* element.onXXX方式（比较古老，不推荐使用） 这种方式添加事件IE6/7/8只支持window.event不支持参数传入，
Firefox只支持参数传入不支持其它方式。
IE9/Opera/Safari/Chrome 两种方式都支持。
*/ var d4 = document.getElementById('bb');
function clk(e) {
alert(e); // 所有浏览器弹出的信息框显示都是事件对象。
alert(e.srcElement.tagName || e.currentTarget.tagName);
e = e || window.event;
alert(e); // IE6/7/8中和上个e弹出相同的对象。
}
if (d4.addEventListener) {
d4.addEventListener('click', clk, false);
alert("addEventListener");
}
if (d4.attachEvent) {
d4.attachEvent('onclick', clk);
alert("attachEvent");
}
/* addEventListener、attachEvent方式（推荐使用） 结论：
通常事件句柄里有这句话：e = e || window.event;
但是在这种调用方式（addEventListener、attachEvent方式）中没什么作用，
这是什么原因呢？上边参考文章的总结里指出了原因，即：
“IE6/7/8支持通过window.event获取对象，
通过attachEvent方式添加事件时也支持事件对象作为句柄第一个参数传入”
因为IE6/7/8在attachEvent方式添加事件时同时支持两种方式，所以事件句柄中的参数e在
IE6/7/8中会自动转换为window.event。
这么以来，这句e = e || window.event;在此处就不需要了（个人结论）。 */ /*
在编写跨浏览器的函数库时，IE和标准事件对象的属性的差异的问题需要解决。
下边抽出相关代码，讨论这个问题在这里的体现。
*/
var _E = {
BindEvent: function (object, fun) {
if (arguments.length == 1) {
fun = arguments[0];
object = null;
}
var args = Array.prototype.slice.call(arguments, 2);
return function (event) {
return fun.apply(object, [fixEvent(event)].concat(args));
}
}
};
function fixEvent(event) { // 统一不同浏览器的event对象
if (event) return event;
event = window.event;
event.pageX = event.clientX + getScrollLeft(event.srcElement);
event.pageY = event.clientY + getScrollTop(event.srcElement);
event.target = event.srcElement;
event.stopPropagation = stopPropagation;
event.preventDefault = preventDefault;
var relatedTarget = {
"mouseout": event.toElement, "mouseover": event.fromElement
}[event.type];
if (relatedTarget) { event.relatedTarget = relatedTarget; } return event;
};
function stopPropagation() { this.cancelBubble = true; };
function preventDefault() { this.returnValue = false; }; // 测试代码如下
function get(ev) {
alert(ev.pageX);
}
var cc = document.getElementById("cc");
var clickHandler = _E.BindEvent(get);
cc.attachEvent('onclick', clickHandler); // IE6/7/8下测试
/*
结果点击id为cc的div元素后，弹出undefined。说明ev.pageX根本不存在。
可是我们在fixEvent()里已经做了事件对象的统一工作。
调试会发现：fixEvent()里if (event) return event;这句是执行后就直接return了，
这里的event按照道理说应该是undefined，但是事实并不是。 //
至于原因个人觉得就是这里：因为IE6/7/8在attachEvent方式添加事件时同时支持两种方式，
所以事件句柄中的参数会自动转换为window.event。也就是说参数不是undefined //
所以在这里用if (event) return event;判断事件对象不妥。
（说明：fixEvent()这段代码参考自博客园里cloudgamer的函数库，
他里边就是这种写法，个人觉得有错误，希望有兴趣的朋友也做做验证）
*/ </script>
</body>
</html>
window.event的更多相关文章
- JS控制键盘录入 和 window.event.keycode对照
一.只允许录入整数 1.不允许录入非数字(按下字母键就会提示并清空) function intOnly() { if (!(window.event.keyCode >= 48 &&am ...
- window.event.srcElement与window.event.target 触发事件的元素
IE浏览器支持window.event.srcElement , 而firefox支持window.event.target:<input type="text" onblu ...
- 解决webkit浏览器中js方法中使用window.event提示未定义的问题
这实际上是一个浏览器兼容性问题,根源百度中一大堆,简要说就是ie中event对象是全局变量,所以哪里都能使用到,但是webkit内核的浏览器中却不存在这个全局变量event,而是以一个隐式的局部变量的 ...
- window.event对象详尽解析
event代表事件的状态,例如触发event对象的元素.鼠标的位置及状态.按下的键等等. event对象只在事件发生的过程中才有效. event的某些属性只对特定的事件有意义.比如,fromEleme ...
- JavaScript 中的window.event代表的是事件的状态,jquery事件对象属性,jquery中如何使用event.target
http://wenda.haosou.com/q/1373868839069215 http://kylines.iteye.com/blog/1660236 http://www.cnblogs. ...
- 火狐和IE的window.event对象详解(转载)
FF的FIREBUG,不仅能测试JS还能检查CSS错误,是一般常用的. 但它主要检查FF方面的错误,对IE就无能为力了. 要测试IE,就用ieTester,它可以测试IE几乎所有版本(1.0恐怕也用不 ...
- js事件源window.event.srcElement兼容性写法
<html> <body> <p>一个好处就是 我想让body(或其他元素内)的某些对象响应事件 就不用挨个儿去写 只要在外层上写一个 然后检查event.srcE ...
- Event/window.Event属性和方法
type:事件的类型,如onlick中的click:srcElement/target:事件源,就是发生事件的元素:button:声明被按下的鼠标键,整数,1代表左键,2代表右键,4代表中键,如果按下 ...
- 如何解决firefox下window.event的问题
一.在函数中传递event参数 在函数中传递event参数,这样我们就可以兼容IE和FF的event的获取了,如下面的函数: function _test(evt){ var src = evt ...
随机推荐
- 再过几个月Apple Watch就要正式发布了
本文由cocoaChina译者小组成员@TurtleFromMars 翻译自Appcoda,原作者:julian engel,原文:WatchKit Introduction: Building a ...
- Oracle 游标使用全解(转)
-- 声明游标:CURSOR cursor_name IS select_statement --For 循环游标 --(1)定义游标 --(2)定义游标变量 --(3)使用for循环来使用这个游标 ...
- 转：DataGridView列的宽度、行的高度自动调整
注意:DataGridView控件是从.NET Framework 2.0版本开始追加的. 介绍一下DataGridView列的宽度和行的高度,根据单元格或Header的内容(一般是内容全部被表示)自 ...
- 改进iOS客户端的升级提醒功能
改进iOS客户端的升级提醒功能 功能设计 先申明一下,我是码农,不是一个产品经理,但我觉得现有市面上的很多 App,设计的 "升级提示功能" 都不太友好.在此分享一下我的想法,欢迎 ...
- 1047. Student List for Course (25)
Zhejiang University has 40000 students and provides 2500 courses. Now given the registered course li ...
- 【hihoCoder】1049.后序遍历
问题:http://hihocoder.com/problemset/problem/1049?sid=767510 已知一棵二叉树的前序遍历及中序遍历结果,求后序遍历结果 思路: 前序:根-左子树- ...
- Odoo Website 替换 Summernote 为第三方富文本编辑器
随着用odoo的人越来越多,奇葩的需求也是越来越多.... 这不,有同学就想替换掉website forum里边的summernote控件,花了点时间研究了一下,先说结论:替换是可行的. 先上替换之后 ...
- 如何防御“神器”Mimikatz窃取系统密码？
Mimikatz是一款能够从Windows中获取内存,并且获取明文密码和NTLM哈希值的神器,本文将介绍如何防御这款软件获取密码. Mimikatz介绍 Mimikatz是一款能够从Windows认证 ...
- Linux关闭休眠和屏保模式
本人因为特殊需求,想让某台Linux主机始终显示某个程序,显示器不能关机或者休眠或进入屏保模式. 环境:Ubuntu 11.10 最小化模式安装并安装有轻量级桌面openbox(非gnome).因为X ...
- 利用logminer恢复delete误删除操作的数据
1环境准备 日志挖掘可以基于日志.基于时间.基于SCN分析,这里我们将演示一个基于SCN的分析案例. 开启补充日志功能(必须开始,否则不能捕获DML操作日志): 创建一张livan表,往里面插入了14 ...