JS中多个onload冲突解决办法

时间:2024-01-18 15:11:44

一  多个window.onload冲突

在一个页面中有两个JavaScript 分别都用到了window.onload
一个是:window.onload=externallinks,另一个是:window.onload=beijing2008
这样就造成了一个JavaScript
运行不了。

写成这样就可以了window.onload=function(){externallinks();beijing2008();}

还有一种方法,举个例子

<script type="text/javascript">
function
$(obj){return document.getElementById(obj);}
window.onload=function(){
   onload2();
   onload3();
}
function
onload2(){
   $("aa").onclick=function dd(){alert("haha")};
}
function
onload3(){
   alert("加载完成");
}</script>

第三种方法:

用window.attachEvent和 window.addEventListener来解决问题了。
当某一事件被触发时需要执行某个函数,在IE下可用attachEvent,在FF下则要用addEventListener。

attachEvent()有两个参数,第一个是事件名称,第二个是需执行的函数;

addEventListener()有三个参数,第一个是事件名称,但与IE事件不同的是,事件不带"on",比如"onsubmit"在这里应为"submit",第二个是需执行的函数,第三个参数为布尔值;

例如:(可以在IE和FF下分别测试):
<input type="button" id="ie" value=" IE " />

<input type="button" id="ff" value=" FF " />

<script type="text/javascript">

var isIE = (document.all && window.ActiveXObject && !window.opera) ? true : false;

if(isIE)
{

 document.getElementById(’ie’).attachEvent("onclick", Fun);
}
else

{
 document.getElementById(’ff’).addEventListener("click", Fun, false);

}
function Fun()
{
 if(isIE)
 {
  alert(’I\’m IE’);

 }
 else
 {
  alert(’I\’m Not IE’);
 }
 
}

</script>
所以我们可以直接这样编写:
if (document.all){

 window.attachEvent("onload",调用函数名)//对于IE
}
else{

 window.addEventListener("load",调用函数名,false);//对于FireFox
}

二  window.onload 与body onload冲突

onload事件是window对象才有的,<body onload="func">这样设置只是为了方便,其实仍然是window.onload=func,且window.onload只允许指定一次,冲突是必然的;如果要指定多个,同上的方法