删除事件侦听器

removeEventListener() 方法删除已使用 addEventListener() 方法附加的事件处理程序:

element.removeEventListener("mousemove", myFunction);

在将元素添加到元素时,removeEventListener 中的所有内容(eventname,function 和 options)必须与一个集匹配。


.bind with removeListener

在添加事件监听器时对函数使用 .bind 将阻止删除该函数,实际删除可以编写的 eventListener:

function onEvent() {
   console.log(this.name);
}

var bindingOnEvent = onEvent.bind(this);

document.addEventListener('click', bindingOnEvent);

...

document.removeEventListener('click', bindingOnEvent);

只听一次活动

在广泛支持 once 选项之前,我们必须在第一次触发事件时手动删除偶数侦听器。

这个小帮手将帮助我们实现这一目标:

Object.prototype.listenOnce = Object.prototype.listenOnce ||
  function listenOnce(eventName, eventHandler, options) {
      var target = this;
      target.addEventListener(eventName, function(e) {
          eventHandler(e);
          target.removeEventListener(eventName, eventHandler, options);
      }, options);
  }

var target = document.querySelector('#parent');
target.listenOnce("click", clickFunction, false);

* 将函数附加到 Object 原型不是最佳实践,因此你可以删除此代码的第一行并将其作为第一个参数添加到其中。