溫馨提示×

您好，登錄后才能下訂單哦！

密碼登錄×
登錄注冊(cè)×
其他方式登錄
點(diǎn)擊 登錄注冊(cè) 即表示同意《億速云用戶(hù)服務(wù)條款》

JS監(jiān)聽(tīng)事件的疊加和移除功能

發(fā)布時(shí)間：2020-08-28 19:35:56 來(lái)源：腳本之家 閱讀：225 作者：楊 小匠 欄目：web開(kāi)發(fā)

html DOM元素有很多on開(kāi)頭的監(jiān)聽(tīng)事件，如onload、onclick等，見(jiàn)DOM事件列表。但是同一種事件，后面注冊(cè)的會(huì)覆蓋前面的：

window.onresize = function(){
  alert(1);
}
window.onresize = function(){
  alert(2);
}
// 改變窗口大小時(shí)，只會(huì)彈出2

addEventListener監(jiān)聽(tīng)

　　利用addEventListener添加監(jiān)聽(tīng)事件，可以重復(fù)添加，并不會(huì)互相覆蓋：

window.addEventListener("resize",function(){
  alert(1)
})
window.addEventListener("resize",function(){
  alert(2)
})
// 改變窗口大小時(shí)，先后彈出1和2

　　注意這里面的事件是不帶"on"前綴的。

removeEventListener移除監(jiān)聽(tīng)

　　removeEventListener跟addEventListener相對(duì)應(yīng)，用于移除事件監(jiān)聽(tīng)。

　　如果要移除事件句柄，addEventListener() 的執(zhí)行函數(shù)必須使用外部具名函數(shù)，匿名函數(shù)事件是無(wú)法移除的。

// 匿名函數(shù)事件無(wú)法移除
window.addEventListener("resize",function(){
  alert(1)
})
// 監(jiān)聽(tīng)具名函數(shù)事件
function myResize(){
  alert(2)
}
window.addEventListener("resize",myResize)
// 移除事件監(jiān)聽(tīng)
window.removeEventListener("resize",myResize)

總結(jié)

以上所述是小編給大家介紹的JS監(jiān)聽(tīng)事件的疊加和移除，希望對(duì)大家有所幫助，如果大家有任何疑問(wèn)請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)億速云網(wǎng)站的支持！

向AI問(wèn)一下細(xì)節(jié)

免責(zé)聲明：本站發(fā)布的內(nèi)容（圖片、視頻和文字）以原創(chuàng)、轉(zhuǎn)載和分享為主，文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如果涉及侵權(quán)請(qǐng)聯(lián)系站長(zhǎng)郵箱：is@yisu.com進(jìn)行舉報(bào)，并提供相關(guān)證據(jù)，一經(jīng)查實(shí)，將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI
助
手