Js中window.onload会覆盖

之前好长时间都注重项目的开发,没有整理一些知识要点,是不是有点自私,其实这是一种懒惰。闲话完毕,转入正题。在前些日子开发完typecho的验证码插件(seccode)之后,在后台的该插件设置页面中加了一个window.onload函数来处理一些事件。但是过了一天,感觉这个好像会被其他插件覆盖,那么这段代码将不会执行,显然这不是我们想要的。

下面代码说明:
<script type="text/javascript">
window.onload=function() {
	alert(123);
}

window.onload=function() {
	alert(345);
}
</script>
上面的程式将会弹出 345,显然可以说明一个问题,函数覆盖了。
接着看下面的代码:
<script type="text/javascript">
window.attachEvent('onload', function(){
	alert(123);
});
window.attachEvent('onload', function(){
	alert(345);
});
</script>
上面的程式将会先弹出 345,然后弹出 123。这说明函数没有覆盖掉,不过要注意是先执行最后绑定的事件。但是这个代码只有在ie下可执行,在FF,chrome下是不行的。
继续往下看,下面的代码将完美实现window.onload不覆盖问题:
<script type="text/javascript">
function fun1() {
	alert(123);
}
function fun2() {
	alert(345);
}
if(document.all) {
	window.attachEvent('onload', fun2);     //注意这里是 fun2
	window.attachEvent('onload', fun1);
} else {
	window.addEventListener('load', fun1);  //注意这里是 fun1
	window.addEventListener('load', fun2);
}
</script>

为了让ie浏览器与其他浏览器,比如chrome,Firfox得到相同的执行结果,请注意区分上面的几行代码。在ie下是先执行后绑定的事件函数,而在其他浏览器中却是先执行先绑定的事件函数,所以这里写的顺序不一样,但是执行结果一样的,都是先执行fun1这个函数。

31
Mar 2012
AUTHOR WiFeng
CATEGORY Web
COMMENTS 2 Comments