我想删除使用addEventListener()添加的所有特定类型的事件侦听器。我所看到的所有资源都在告诉你需要这样做:
elem.addEventListener('mousedown',specific_function);
elem.removeEventListener('mousedown',specific_function);
但我希望能够在不知道它目前是什么情况下清除它，就像这样:
elem.addEventListener('mousedown',specific_function);
elem.removeEventListener('mousedown');
当前回答
在不知道哪个回调附加到窗口监听器的极端情况下，处理程序可以包装窗口addEventListener，变量可以存储监听器，以通过removeAllEventListener('scroll')正确删除每个监听器。
var listeners = {};
var originalEventListener = window.addEventListener;
window.addEventListener = function(type, fn, options) {
if (!listeners[type])
listeners[type] = [];
listeners[type].push(fn);
return originalEventListener(type, fn, options);
}
var removeAllEventListener = function(type) {
if (!listeners[type] || !listeners[type].length)
return;
for (let i = 0; i < listeners[type].length; i++)
window.removeEventListener(type, listeners[type][i]);
}
其他回答
通过一行js删除元素中的所有监听器:
element.parentNode.innerHTML += '';
你不能删除一个事件，但是全部?在一次?只做
document.body.innerHTML = document.body.innerHTML
删除全局事件上的所有侦听器
element.onmousedown = null;
现在您可以返回到通过添加事件侦听器
element.addEventListener('mousedown', handler, ...);
此解决方案仅适用于“全局”事件。自定义事件不起作用。以下是全球活动列表:https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers
你也可以重写'yourElement.addEventListener()'方法，并使用'.apply()'方法像正常一样执行侦听器，但在进程中拦截函数。如:
<script type="text/javascript">
var args = [];
var orginalAddEvent = yourElement.addEventListener;
yourElement.addEventListener = function() {
//console.log(arguments);
args[args.length] = arguments[0];
args[args.length] = arguments[1];
orginalAddEvent.apply(this, arguments);
};
function removeListeners() {
for(var n=0;n<args.length;n+=2) {
yourElement.removeEventListener(args[n], args[n+1]);
}
}
removeListeners();
</script>
此脚本必须在页面加载时运行，否则可能无法拦截所有事件侦听器。
确保在使用之前删除' removelistener()'调用。
如果不拦截addEventListener调用并跟踪侦听器，或者使用允许这些功能的库，这是不可能的。如果监听器集合是可访问的，但没有实现该特性，则会出现这种情况。
您可以做的最接近的事情是通过克隆元素来删除所有侦听器，这将不会克隆侦听器集合。
注意:这也会删除element子元素上的监听器。
var el = document.getElementById('el-id'),
elClone = el.cloneNode(true);
el.parentNode.replaceChild(elClone, el);
