Quantcast
Channel: Hyperblue's Blog » Javascript
Viewing all articles
Browse latest Browse all 10

JS中的window.onload事件:attachEvent与addEventListener

$
0
0

可能你也碰到过这种情况,就是在js的代码中用了window.onload后,可能会影响到body中的onload事件。你可以全写在body 中,也可以全放到window.onload中,但是这样并不是很方便,有时我们需要两个同时用到。这时就要用window.attachEvent和 window.addEventListener来解决一下。
下面是一个解决方法。至于attachEvent和addEventListener的用法,可以自己Google或百度一下。

View Code JAVASCRIPT
1
2
3
4
5
6
if (document.all){   
     window.attachEvent('onload',函数名)//IE中   
}   
else{   
     window.addEventListener('load',函数名,false);//firefox   
}

在近来的工作中,用到了attachEvent方法,该方法可以为某一事件附加其它的处理事件,有时候可能比较有用,这里将其基本用法总结一下。
其语法可以查看《DHTML手册》,里面有详细的说明,这里贴一个例子,该例子来自互联网:

View Code JAVASCRIPT
1
2
3
document.getElementById("btn").onclick = method1;   
document.getElementById("btn").onclick = method2;   
document.getElementById("btn").onclick = method3;

如果这样写,那么将会只有medhot3被执行
写成这样:

View Code JAVASCRIPT
1
2
3
4
5
var btn1Obj = document.getElementById("btn1");   
//object.attachEvent(event,function);   
btn1Obj.attachEvent("onclick",method1);   
btn1Obj.attachEvent("onclick",method2);   
btn1Obj.attachEvent("onclick",method3);

执行顺序为method3->method2->method1

如果是Mozilla系列,并不支持该方法,需要用到addEventListener

View Code JAVASCRIPT
1
2
3
4
5
var btn1Obj = document.getElementById("btn1");   
//element.addEventListener(type,listener,useCapture);   
btn1Obj.addEventListener("click",method1,false);   
btn1Obj.addEventListener("click",method2,false);   
btn1Obj.addEventListener("click",method3,false);

执行顺序为method1->method2->method3

引用至:http://hi.baidu.com/layweb2/blog/item/12ef603c073aa43171cf6c5e.html


Viewing all articles
Browse latest Browse all 10

Trending Articles