Javascript 如何删除addEventListener以事件对象作为参数绑定的匿名函数

比如说,

document.addEventListener('keyup',function(ev){
    if(ev.ctrlKey)dosomething();
},false);

---

有没有办法删除匿名函数？

您可以命名一个匿名函数并使用它解除绑定

document.addEventListener('keyup',function handleKeyUp(ev){
    document.removeEventListener(ev.type, handleKeyUp);
    if(ev.ctrlKey)dosomething();
},false);

---

可以使用arrow函数调用函数并传递事件

document.addEventListener（'keyup'，event=>dosomething（event））；
功能剂量测量（事件）{
控制台日志（“测试1”）；
event.currentTarget.removeEventListener（event.type，arguments.callee.caller）；
}
/////////////////////////////////////
//或
document.addEventListener（'keyup'，函数（事件）{
控制台日志（“测试2”）；
event.currentTarget.removeEventListener（event.type，arguments.callee）；
});当函数保持匿名时，无法仅从侦听器函数外部删除该事件侦听器。虽然它在代码中可能是匿名的，但它被分配给某种类型的变量，从而有效地命名它，即使名称是
listeners.keyup[3]

您可以使用1从事件监听器本身中删除事件监听器，也可以从它调用的函数中删除事件监听器（如中所述）

要使用删除侦听器，需要对正在侦听的实际函数进行引用。您需要执行以下操作之一：


命名函数


document.addEventListener（'keyup'，handleKeyupEvent，false）；
功能handleKeyupEvent（ev）{
如果（ev.ctrlKey）{
dosomething（）；
}否则{
log（'keyup事件，无Ctrl键'）；
}
}
函数dosomething（）{
log（'Ctrl键'）；
document.removeEventListener（'keyup'，handleKeyupEvent，false）；
}
您可以为自己编写一个小型接口，用于
addEventListener
，如下所示：

function addEventListener(elt, event, fn) {
  elt.addEventListener(event, fn);
  return function() {
    elt.removeEventListener(event, fn);
  };
}

这将返回一个函数，该函数可用于删除事件侦听器，不管传递了什么函数

要使用此选项，请执行以下操作：

var remove = addEventListener(body, 'click', () => alert('Hi Mom'));

remove();

要在事件侦听器触发后立即删除它，您只需要：

function addEventListenerOnce(elt, event, fn) {
  elt.addEventListener(event, function listener() {
    fn(e);
    elt.removeEventListener(elt, listener);
  });
}

或者，您可以使用新的
{one:true}
选项，该选项正在一些浏览器中实现。
如果您使用惰性样式，例如：
document.onkeyup=function（）{}
，那么您可以执行以下操作：
document.onkeyup=undefined。它必须保持匿名吗？当这起作用时，函数不再是匿名的。它现在有了一个名字。这肯定赢得了“当今矛盾修饰法”奖。很酷的故事。这仍然是处理OP示例的最明智的方法。@Makyen啊啊啊啊，我以为他说的是删除匿名函数（语法）-而不是实际事件@请看改进后的帖子我同意-我最初误读了这篇文章。@Makyen该死-你知道如何让一个人工作。。。请参阅更新的答案。我建议您使用与OP类似的表单（即使用
if（ev.ctrlKey）dosomething（）；
）使用
=>
并不重要（即使用
=>
和
函数
）。实际上，在
dosomething（）
中重新阅读删除它的问题是可以的，但我也会在main函数中显示这样做（不清楚OP是否接受这两个选项）。在主处理程序中，它将只是
参数。被调用方
（有效）。OP不清楚他是否想将其移出处理程序之外，因此您可能想指出这是不可能的。@Makyen问题非常模糊。。。如果他表现出兴趣，我会再次更新-干杯。