无论如何要删除像这样添加的事件监听器：
element.addEventListener(event, function(){/* do work here */}, false);
不更换元素？
答案 0 :(得分：18)
除非您在创建时存储对事件处理程序的引用，否则无法干净地删除事件处理程序。
我通常会将这些添加到该页面上的主对象中，然后您可以在完成该对象时迭代并干净地处理它们。
答案 1 :(得分：15)
你可以删除这样的事件监听器：
element.addEventListener("click", function clicked() {
element.removeEventListener("click", clicked, false);
}, false);
答案 2 :(得分：10)
删除元素的所有事件侦听器的最简单方法是将其outerHTML分配给自身。这样做是通过HTML解析器发送HTML的字符串表示，并将解析后的HTML分配给元素。因为没有传递JavaScript，所以不会有绑定的事件侦听器。
document.getElementById('demo').addEventListener('click', function(){
alert('Clickrd');
this.outerHTML = this.outerHTML;
}, false);<a id="demo" href="javascript:void(0)">Click Me</a>
一个警告是委托事件侦听器或父元素上的事件侦听器，它监视与子节点上的一组条件匹配的每个事件。过去的唯一方法是将元素更改为不符合委托事件监听器的条件。
document.body.addEventListener('click', function(e){
if(e.target.id === 'demo') {
alert('Clickrd');
e.target.id = 'omed';
}
}, false);<a id="demo" href="javascript:void(0)">Click Me</a>
答案 3 :(得分：4)
您可以尝试覆盖element.addEventListener并做任何您想做的事。
类似于：
var orig = element.addEventListener;
element.addEventListener = function (type, listener) {
if (/dontwant/.test(listener.toSource())) { // listener has something i dont want
// do nothing
} else {
orig.apply(this, Array.prototype.slice.apply(arguments));
}
};
ps。：不建议使用，但它可以解决问题（尚未测试）
答案 4 :(得分：2)
修改：根据评论建议Manngo，您应该使用 .off（）而不是 .unbind（）作为 .unbind（）自jQuery 3.0起不推荐使用，自jQuery 1.7起被取代。
即使这是一个老问题并且没有提到jQuery，我也会在这里发布我的答案，因为它是searchterm的第一个结果'jquery删除匿名事件处理程序'。
您可以尝试使用.off()功能删除它。
$('#button1').click(function() {
alert('This is a test');
});
$('#btnRemoveListener').click(function() {
$('#button1').off('click');
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="button1">Click me</button>
<hr/>
<button id="btnRemoveListener">Remove listener</button>
但是，只有在使用jQuery添加了侦听器时才有效 - 不是.addEventListener
找到此here。
答案 5 :(得分：1)
使用文字函数分配事件处理程序是棘手的 - 不仅没有办法删除它们，没有克隆节点并用克隆替换它 - 你也可能无意中多次分配同一个处理程序，如果不能您使用对处理程序的引用。两个函数总是被视为两个不同的对象，即使它们的字符相同。
答案 6 :(得分：1)
旧问题，但这是一个解决方案。
严格来说，除非存储对函数的引用，否则无法删除匿名事件侦听器。由于使用匿名函数的目的大概不是创建新变量，因此您可以将引用存储在元素本身中：
element.addEventListener('click',element.fn=function fn() {
// Event Code
}, false);
稍后，要删除它，可以执行以下操作：
element.removeEventListener('click',element.fn, false);
请记住，第三个参数（false）必须具有与添加事件监听器相同的 值。
但是，问题本身又是另一个问题：为什么？
使用.addEventListener()而不是简单的.onsomething()方法有两个原因：
首先，它允许添加多个事件侦听器。当有选择地删除它们时，这成为一个问题：您可能最终会命名它们。如果您想全部删除它们，那么@ tidy-giant的outerHTML解决方案是很好的选择。
第二，您确实可以选择捕获事件而不是冒泡事件。
如果两个原因都不重要，则可以决定使用更简单的onsomething方法。
答案 7 :(得分：0)
使用ECMAScript2015（ES2015，ES6）语言规范，可以使用此nameAndSelfBind函数来神奇地将匿名回调转换为命名回调，甚至将其主体绑定到自身，从而允许事件监听器删除自身从内部以及从外部范围中删除（JSFiddle）：
(function()
{
// an optional constant to store references to all named and bound functions:
const arrayOfFormerlyAnonymousFunctions = [],
removeEventListenerAfterDelay = 3000; // an auxiliary variable for setTimeout
// this function both names argument function and makes it self-aware,
// binding it to itself; useful e.g. for event listeners which then will be able
// self-remove from within an anonymous functions they use as callbacks:
function nameAndSelfBind(functionToNameAndSelfBind,
name = 'namedAndBoundFunction', // optional
outerScopeReference) // optional
{
const functionAsObject = {
[name]()
{
return binder(...arguments);
}
},
namedAndBoundFunction = functionAsObject[name];
// if no arbitrary-naming functionality is required, then the constants above are
// not needed, and the following function should be just "var namedAndBoundFunction = ":
var binder = function()
{
return functionToNameAndSelfBind.bind(namedAndBoundFunction, ...arguments)();
}
// this optional functionality allows to assign the function to a outer scope variable
// if can not be done otherwise; useful for example for the ability to remove event
// listeners from the outer scope:
if (typeof outerScopeReference !== 'undefined')
{
if (outerScopeReference instanceof Array)
{
outerScopeReference.push(namedAndBoundFunction);
}
else
{
outerScopeReference = namedAndBoundFunction;
}
}
return namedAndBoundFunction;
}
// removeEventListener callback can not remove the listener if the callback is an anonymous
// function, but thanks to the nameAndSelfBind function it is now possible; this listener
// removes itself right after the first time being triggered:
document.addEventListener("visibilitychange", nameAndSelfBind(function(e)
{
e.target.removeEventListener('visibilitychange', this, false);
console.log('\nEvent listener 1 triggered:', e, '\nthis: ', this,
'\n\nremoveEventListener 1 was called; if "this" value was correct, "'
+ e.type + '"" event will not listened to any more');
}, undefined, arrayOfFormerlyAnonymousFunctions), false);
// to prove that deanonymized functions -- even when they have the same 'namedAndBoundFunction'
// name -- belong to different scopes and hence removing one does not mean removing another,
// a different event listener is added:
document.addEventListener("visibilitychange", nameAndSelfBind(function(e)
{
console.log('\nEvent listener 2 triggered:', e, '\nthis: ', this);
}, undefined, arrayOfFormerlyAnonymousFunctions), false);
// to check that arrayOfFormerlyAnonymousFunctions constant does keep a valid reference to
// formerly anonymous callback function of one of the event listeners, an attempt to remove
// it is made:
setTimeout(function(delay)
{
document.removeEventListener('visibilitychange',
arrayOfFormerlyAnonymousFunctions[arrayOfFormerlyAnonymousFunctions.length - 1],
false);
console.log('\nAfter ' + delay + 'ms, an event listener 2 was removed; if reference in '
+ 'arrayOfFormerlyAnonymousFunctions value was correct, the event will not '
+ 'be listened to any more', arrayOfFormerlyAnonymousFunctions);
}, removeEventListenerAfterDelay, removeEventListenerAfterDelay);
})();
答案 8 :(得分：-1)
以下对我来说效果很好。代码处理另一个事件触发从元素中删除侦听器的情况。事先不需要函数声明。
myElem.addEventListener("click", myFunc = function() { /*do stuff*/ });
/*things happen*/
myElem.removeEventListener("click", myFunc);
答案 9 :(得分：-1)
如果您正在使用jQuery，请尝试off方法
$("element").off("event");
答案 10 :(得分：-1)
Jquery .off（）方法删除附加了.on（）
的事件处理程序