在js中綁定多個(gè)事件用到的是兩個(gè)方法:attachEvent和addEventListener,但是這兩個(gè)方法又存在差異性
attachEvent方法 只支持IE678,不兼容其他瀏覽器
addEventListener方法 兼容火狐谷歌,不兼容IE8及以下
addEventListener方法
div.addEventListener('click',fn);div.addEventListener('click',fn2);function fn(){ console.log("春雨綿綿"); }function fn2(){ console.log("到處潮濕"); }attachEvent方法
div.attachEvent('onclick',fn);div.attachEvent('onclick',fn2);function fn(){ console.log("春雨綿綿"); }function fn2(){ console.log("到處潮濕"); }注意點(diǎn):attachEvent方法綁定的事件是帶on的,addEventListener綁定的事件是不帶on的
下面我寫了一個(gè)兼容了IE和火狐谷歌的方法
var div=document.getElementsByTagName("div")[0]; addEvent('click',div,fn) function addEvent(str,ele,fn){ ele.attachEvent?ele.attachEvent('on'+str,fn):ele.addEventListener(str,fn); } function fn(){ console.log("春雨綿綿"); }這樣就完美的解決了兼容性的問題
有綁定事件的話,那就肯定有解綁事件,但是解綁事件和綁定事件一樣,萬(wàn)惡的IE還是會(huì)搞特殊化
detachEvent方法 只支持IE678,不兼容其他瀏覽器
removeEventListener方法 兼容火狐谷歌,不兼容IE8及以下
detachEvent方法寫法:
ele.detachEvent("onclick",fn);
removeEventListener的寫法:
ele.removeEventListener("click",fn);
下面我寫了一個(gè)兼容性的方法給大家參考,實(shí)現(xiàn)也是很簡(jiǎn)單
function remove(str,ele,fn){ ele.detachEvent?ele.detachEvent("on"+str,fn):ele.removeEventListener(str,fn); }注意點(diǎn):不管是綁定事件attachEvent還是刪除事件detachEvent都是要加on的,removeEventListenser和addEventListenser則不需要加on
以上就是本文的全部?jī)?nèi)容,希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作能帶來(lái)一定的幫助,同時(shí)也希望多多支持武林網(wǎng)
新聞熱點(diǎn)
疑難解答
圖片精選
網(wǎng)友關(guān)注