常見的綁定事件有直接綁定在頁面元素中比如<div id="wrap" onclick="a();"></div>，這個換種方法也就是分離出來寫在js代碼裡如document.getElementById('wrap').onclick = function(){a();}，此時如果需要綁定多個方法則直接寫在一起即可如document.getElementById('wrap').onclick = function(){a();b();}或<div id="wrap" onclick="a();b();"></div>。然而我們時常這樣來寫一個單獨的綁定方法bind(el,name,fn)，具體代碼如下。
復制代碼 代碼如下:
function bind(el,name,fn){ //綁定事件
return el.addEventListener?el.addEventListener(name,fn,false):el.attachEvent('on'+name,fn);
}
這樣在一個dom對象上綁定多個click事件如
復制代碼 代碼如下:
bind(document.getElementById('wrap'),'click',a);
bind(document.getElementById('wrap'),'click',b);
在ie6,7,8下面就會出現執行順序的問題（ie9下面暫時不清楚，沒有環境測試，希望有環境的朋友幫忙測試下），而其他浏覽器ff，chrome，safari下則是按照順序執行。查找資料得到的是ie8下會顛倒執行順序，ie6，ie7則是隨機執行的，這個我實在不明白ie怎麼會出現隨機執行？難不成是別有目的的？如果有知道這樣做的目的的朋友也能告知一聲，經過自己的測試證實ie8確實顛倒執行的順序而ie6,7則無規律的執行。我理解的隨機執行應該是每次執行都是不一樣的順序然而實際上只要寫的時候順序固定那麼執行的時候順序也是固定的（雖然無規律也或許是我沒找出規律）。
但是jQuery的$.bind(type, data, fn)方法則沒有這個問題，找jQuery的原代碼看了下，發現裡面也是用的
復制代碼 代碼如下:
if (elem.addEventListener)
elem.addEventListener(type, handle, false);
else if (elem.attachEvent)
elem.attachEvent("on" + type, handle);
這樣方法綁定的事件，但是在此之前會判斷該jquery對象上面是否已經同一個類型的handlers，如果有則不會重復綁定而是把該對象的handle合並到handlers中成為一個方法相當於這樣function c(){a();b();}，按照順序的壓入方法這樣實現在ie下不會出現綁定多個方法時出現執行順序混亂了.
如下是網友的回復：
IE6 7 會隨機執行？我上次測試的時候貌似順序相反，沒有隨機執行這一說。
我特意去測試了
復制代碼 代碼如下:
<script type="text/javascript">
var bind = function(e,t,fn){
if(e.addEventListener){
e.addEventListener(t, fn, false);
}else if(e.attachEvent){
e.attachEvent('on'+ t, fn);
}
}
</script>
<a href="#" id="test1">test</a>
<script type="text/javascript">
var e = document.getElementById('test1');
bind(e,'click',function(){alert(1)});
bind(e,'click',function(){alert(2)});
bind(e,'click',function(){alert(3)});
bind(e,'click',function(){alert(4)});
bind(e,'click',function(){alert(5)});
</script>
並無隨機一說 IE6。不知道你如何測試的。
作者的回答:
我拿你的代碼在ie6，ie7下測試也是無規律的執行順序，這裡是資料出處http://www.w3help.org/zh-cn/causes/SD9011，上面所謂的隨機執行我也覺得欠妥，就如我博文裡說的那樣，執行順序是沒有規律的，但是每次執行的順序是一樣的，如果是隨機那麼應該每次執行的順序都不一樣才對，這才是我想要說明的