事件綁定及深刻上-多個window.onload

事件綁定及深刻 多個window.onload一塊兒執行

如何讓執行兩個window.onload
window.onload=function(){
alert('Lee');
}

if(typeof window.onload=='function'){
var saved=null; //保存上一個事件對象
saved=window.onload;
}

//saved就是window.onload，saved()至關於window.onload()，可是window.onload()不能執行的
//因此saved()至關於window.onload=function(){}

window.onload=function(){
if(saved) saved(); //執行上一個事件
alert(Mr.Lee); //執行本事件
}

----------------------------------------------------
//事件切換器
<style>
.red{
width: 100px;
height: 100px;
background:red;
}
.blue{
width: 100px;
height: 100px;
background:blue;
}
</style>

<div id="box" class="red">測試Div</div>

//添加事件函數
//obj至關於window
//type至關於onload
//fn至關於function(){}
function addEvent(obj,type,fn){
//用於保存上一個事件
var saved=null;
//判斷事件是否存在
if(typeof obj['on'+type]=='function'){
saved=obj['on'+type]; //保存上一個事件
}
//執行事件
obj['on'+type]=function(){
if(saved) saved();
fn.call(this); //把this傳遞過去
}
}

addEvent(window,'load',function(){
alert('Lee');
})

addEvent(window,'load',function(){
alert('Mr.Lee');
})

addEvent(window,'load',function(){
alert('Miss.Lee');
})

如下代碼事件切換：
addEvent(window,'load',function(){
var box=document.getElementById('box');
addEvent(box,'click',function(){
alert('Lee');
});
addEvent(box,'click',toBlue);
})

function toRed(){
this.className='red';
removeEvent(this,'click');
addEvent(this,'click',toBlue);
}

function toBlue(){
this.className='blue';
removeEvent(this,'click');
addEvent(this,'click',toRed);
}
//當不停的切換的時候，瀏覽器忽然卡死，而且報錯：too much recursion，太多的遞歸
//由於積累了太多的保存的事件，
//解決方案，就是用完的事件，就馬上移除掉

function removeEvent(obj,type){ if(obj['on'+type]) obj['on'+type]=null;}