快捷導(dǎo)航

removeEventListener事件不起作用的問題及解決

更新時間：2026年03月29日 11:14:25 作者：平平無奇小碼農(nóng)qwq

文章指出在使用JavaScript的removeEventListener移除事件監(jiān)聽器時,應(yīng)使用外部函數(shù)而非匿名函數(shù),并強(qiáng)調(diào)了addEventListener和removeEventListener使用時的一些注意事項,例如在IE中使用attachEvent和detachEvent時不要傳入匿名函數(shù)

removeEventListener事件不起作用

例子

給按鈕添加點擊事件

<button class="btn2">點我啊啊啊啊</button>

var btn2 = document.querySelector('.btn2');
btn2.addEventListener('click', function () {
	alert('1111');
}, false);

btn2.removeEventListener('click', function () {
    alert('1111');
}, false);

這樣寫的removeEventListener() 移除監(jiān)聽事件是不起作用的，要寫成以下這種形式：

function showMsg() {
	alert('1111');
}
// IE8及以下不支持
btn2.addEventListener('click', showMsg, false);
btn2.removeEventListener('click', showMsg, false);

因為removeEventListener的第二個參數(shù)要使用外部函數(shù)，如上例的showMsg，寫成匿名函數(shù)function () { } 是不起作用的。

IE的attachEvent和detachEvent也不要傳入匿名函數(shù)

注意

（1）addEventListener和removeEventListener的第三個參數(shù)默認(rèn)就是false，可以不寫。

（2）第一個參數(shù) click前面不要加on，是click不是onclick。其他事件也是如此

總結(jié)

以上為個人經(jīng)驗，希望能給大家一個參考，也希望大家多多支持腳本之家。

您可能感興趣的文章:

相關(guān)文章

模仿IE自動完成功能
模仿IE自動完成功能...
2006-10-10
js實現(xiàn)橫向伸展開的二級導(dǎo)航菜單代碼
這篇文章主要介紹了js實現(xiàn)橫向伸展開的二級導(dǎo)航菜單代碼,涉及javascript鼠標(biāo)事件及頁面元素遍歷的相關(guān)技巧,需要的朋友可以參考下
2015-08-08
JavaScript實現(xiàn)密碼框輸入驗證
這篇文章主要為大家詳細(xì)介紹了JavaScript實現(xiàn)密碼框輸入驗證，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2021-09-09
如何在js中引入less的變量
這篇文章主要介紹了如何在js中引入less的變量,本文通過實例代碼給大家介紹的非常詳細(xì)，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值，需要的朋友可以參考下
2023-07-07
JS生成一維碼(條形碼)功能示例
這篇文章主要介紹了JS生成一維碼(條形碼)功能,結(jié)合完整實例形式分析了JS插件生成條形碼的具體步驟與相關(guān)操作技巧,需要的朋友可以參考下
2017-01-01
JavaScript lodash常見用法系列小結(jié)
本篇文章主要介紹了JavaScript lodash用法小結(jié)，非常不錯，具有參考借鑒價值，對于Javascript lodash教程感興趣的同學(xué)可以參考一下
2016-08-08
使用JavaScript實現(xiàn)表格編輯器(實例講解)
下面小編就為大家?guī)硪黄褂肑avaScript實現(xiàn)表格編輯器(實例講解)。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
2017-08-08
JavaScript面試之如何實現(xiàn)數(shù)組拍平（扁平化）方法
數(shù)組扁平化是指將一個多維數(shù)組變?yōu)橐痪S數(shù)組,下面這篇文章主要給大家介紹了關(guān)于JavaScript面試之如何實現(xiàn)數(shù)組拍平（扁平化）方法的相關(guān)資料,文中通過示例代碼介紹的非常詳細(xì),需要的朋友可以參考下
2021-11-11
element日歷組件只顯示月和日如何把年份隱藏掉
這篇文章主要介紹了element日歷組件只顯示月和日如何把年份隱藏掉的操作方法,本文通過實例代碼給大家介紹的非常詳細(xì),對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值,需要的朋友參考下吧
2023-12-12
js判斷數(shù)組key是否存在(不用循環(huán))的簡單實例
下面小編就為大家?guī)硪黄猨s判斷數(shù)組key是否存在(不用循環(huán))的簡單實例。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
2016-08-08