天天看点

javascript中window.onload和body onload冲突的解决方法

今天在修改一个js的bug:body中的onload事件不起作用啦,仔细排查才发现原来js中有一段window.onload的代码,

发现原来这两个同时存在的时候会有冲突,只能有一个起作用,为了解决这一冲突,我在网上查到了解决方法,而且自己也想到了一个新的解决方案。

第一种方法:使用attachEvent、addEventListener方法

if (document.all){

 window.attachEvent('onload',函数名)//IE中

}

else{

 window.addEventListener('load',函数名,false);//firefox

}

函数名指的是没有起作用的方法名称!

<html>
<head>
<script>
function soccerOnload() {
 alert("test2");
}
window.onload = init;
if (document.all){
  window.attachEvent('onload',init);//init是没有起作用的方法
}
else{
  window.addEventListener('load',init,false);
}

function init() {
  alert("test1");
}

</script>
  </head>
  <body οnlοad="soccerOnload();">
  <from name="theform"> 测试:<input name="birthday" id="birthday">
</form> 
  </body>
</html>
           

第二种方法:使用document.onreadystatechange

将没有起作用的那个函数写到 document.onreadystatechange 中

如:

document.onreadystatechange = init;

function init() {

 alert("test1");

}

第三种方法:

function addLoadEvent(func){

var oldοnlοad=window.onload;

if(typeof window.onload!='function'){

window.οnlοad=func;

}else{

window.οnlοad=function(){

oldonload();

func();

}

}

}

//添加要加载执行的事件:

addLoadEvent(init);