[ javascript ] attachEvent事件
日期：2014-05-16 浏览次数：20372 次
[ javascript ] attachEvent事件!
最近在看本司徒大神的博客，发现其中很是有还多可以发掘的东西的!
如下:
<!doctype html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title>Document</title>
</head>
<body>
<input type="button" value="call me" id="call-id" alt="1"/>
</body>
<script type="text/javascript">
var E = {
on:function(el,type,fn){
el.addEventListener?
el.addEventListener(type,fn,false):el.attachEvent("on" + type,function(){
fn.call(el,window.event);
})
/*
el.addEventListener(type,fn,false):el.attachEvent("on" + type,fn);
*/
}
};
function handler(e){
//alert(e.getAttribute("alt"));
alert(this == window);
alert(e.srcElement);
}
E.on(document.getElementById("call-id"),"click",handler);
</script>
</html>
以上被注释的代码，想了很久没有想明白为什么他要采用一种全新的方式去调用，那就是用call ?
包括很多书上都是这样写的，都是直接执行。
于是开始各种搜索，测试之。
发现原来还是有区别的。
在这里，使call去调用：
fn.call(el,window.event);
1 第一点，它能够确保，事件对象作为第一个参数被传入，这里直接将window.event传入。（这一点，司徒大神已经说过了）
2 在某些浏览器下，ie678,如果直接调用，会出现 this == window 的情况，这关于这个问题，就不多说了，都是万恶的IE导致的。
那么如果采用call 可以保证this的值指向事件源对象。这对于兼容标准浏览器和IE我想是有一定的用处的。
偶有所得，以记录之，谨防忘记!
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
