删除全局事件上的所有侦听器

element.onmousedown = null;

现在您可以返回到通过添加事件侦听器

element.addEventListener('mousedown', handler, ...);

此解决方案仅适用于“全局”事件。自定义事件不起作用。以下是全球活动列表:https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers

如果你删除监听器的唯一目的是阻止它们运行，你可以在窗口中添加一个事件监听器，捕捉并取消给定类型的所有事件:

window.addEventListener(type, function(event) {
    event.stopImmediatePropagation();
}, true);

为第三个参数传递true会导致事件在向下时被捕获。停止传播意味着事件永远不会到达正在侦听它的侦听器。

但请记住，这是非常有限的用途，因为您不能为给定类型添加新的侦听器(它们都将被阻塞)。有一些方法可以在某种程度上解决这个问题，例如，通过触发一种新的事件，只有你的听众知道要听。以下是你可以做到的方法:

window.addEventListener('click', function (event) {
    // (note: not cross-browser)
    var event2 = new CustomEvent('click2', {detail: {original: event}});
    event.target.dispatchEvent(event2);
    event.stopPropagation();
}, true);

element.addEventListener('click2', function(event) {
    if (event.detail && event.detail.original) {
        event = event.detail.original
    }
    // Do something with event
});

但是，请注意，这可能不适用于快速事件(如mouemove)，因为事件的重新分派会引入延迟。

如果您需要这样做，最好的方法是首先跟踪添加的侦听器，正如Martin Wantke的回答中所概述的那样。

在不引用原始函数的情况下删除事件侦听器的现代方法是使用AbortController。需要注意的是，您只能中止您自己添加的侦听器。

const buttonOne = document.querySelector('#button-one'); const buttonTwo = document.querySelector('#button-two'); const abortController = new AbortController(); // Add multiple click event listeners to button one buttonOne.addEventListener( 'click', () => alert('First'), { signal: abortController.signal } ); buttonOne.addEventListener( 'click', () => alert('Second'), { signal: abortController.signal } ); // Add listener to remove first button's listeners buttonTwo.addEventListener( 'click', () => abortController.abort() ); <p>The first button will fire two alert dialogs when clicked. Click the second button to remove those listeners from the first button.</p> <button type="button" id="button-one">Click for alerts</button> <button type="button" id="button-two">Remove listeners</button>

通过一行js删除元素中的所有监听器:

element.parentNode.innerHTML += '';

 var events = [event_1, event_2,event_3]  // your events

//make a for loop of your events and remove them all in a single instance

 for (let i in events){
    canvas_1.removeEventListener("mousedown", events[i], false)
}

你也可以重写'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()'调用。