無法刪除我附加的事件監聽器

Question

我在一個模塊中附加了一個事件監聽器

document.addEventListener('keydown', () => this.clickCatcherFunction(target_id));

但是當執行該功能時，該行

document.removeEventListener("keydown", () => this.clickCatcherFunction());

不會刪除偵聽器。 下次按下一個鍵時，它會執行clickCatcherFunction並失敗。 我如何傳遞它與我用來創建它以刪除它的相同功能？

其他失敗的嘗試：

document.removeEventListener("keydown", this.clickCatcherFunction());
document.removeEventListener("keydown", clickCatcherFunction());
document.removeEventListener("keydown", clickCatcherFunction);

Answer 1

只有命名功能，可以刪除，而不是匿名功能，因為即使你作出相同的匿名函數，它不會是你以前添加的功能完全相同的實例 。 你必須單獨設置你的功能，如下所示：

function clickCather(evt){
  .  .  .
}

然后你可以使用addEventListener("click", clickCatcher)和removeEventListener("click", clickCatcher);添加和刪​​除它removeEventListener("click", clickCatcher); 因為你將在內存中引用相同的函數實例。

並且，請注意，使用addEventListener和removeEventListener都不會調用函數（函數名末尾沒有括號），您只想引用它。