如何在创建时删除 EventListener？

Question

我需要一种方法来删除对象的 EventListeners 作为队列之类的东西，其中添加的第一个 EventListener 是列表中的第一个，或者第一个被删除的。
另外，如果我不知道 EventListener 的作用（但我知道持有 EventListener 的对象）
就像我有这个设置一样：

var btn = document.getElementById("mybtn");
// Some example listeners, some don't make sense.
btn.addEventListener("click", onClick, false);
btn.addEventListener("keydown", onKeyDown, false);
btn.addEventListener("keyup", onKeyUp, false);

function onClick(){
    alert("You clicked me!");
}

function onKeyDown(){
    console.log("Key down");
}

function onKeyUp(){
    console.log("Key up");
}

<button id="mybtn">Do stuff! I use listeners.</button>

我会在 mybtn 上设置三个 EventListner。现在，我将如何删除第一次添加的 EventListener，或者获取 EventListener 列表并从列表中删除一个？

有什么办法吗？

Answer 1

删除事件侦听器的唯一方法是调用 removeEventListener 并将要删除的侦听器作为参数传递给它。

要实现您想要的效果，您必须按照自己添加的顺序维护监听器列表。

由于您要处理不同类型的侦听器，因此您也需要跟踪类型。

function someListener(e) {}
function someOtherListener(e) {}
function someOtherListener(e) {}

var tracker = [];

btn.addEventListener("click", someListener, false);
tracker.push({ event: "click", listener: someListener });
btn.addEventListener("keydown", someOtherListener, false);
tracker.push({ event: "keydown", listener: someOtherListener });
btn.addEventListener("keyup", someOtherListener, false);
tracker.push({ event: "keyup", listener: someOtherListener });

var remove = tracker.unshift();
btn.removeEventListener( remove.event, remove.listener );

（注意：对于上面的更优雅的方法，您可以创建数组然后遍历它以添加侦听器。）

如何在创建时删除 EventListener？

How to remove an EventListener by the time of creation?

javascript

event-listener