JavaScript - 如何检查事件是否已添加

Question

我想为beforeunload添加一次监听器。这是我的伪代码：

if(window.hasEventListener('beforeunload') === false) {
     window.addEventListener('beforeunload', function() { ... }, false);
}

但hasEventListener显然不存在。我怎样才能做到这一点？感谢。

Answer 1

实际上，无需检查是否将侦听器添加到目标：

  

如果在具有相同参数的同一EventTarget上注册了多个相同的EventListener，则会丢弃重复的实例。它们不会导致EventListener被调用两次，并且由于重复项被丢弃，因此不需要使用removeEventListener方法手动删除它们。

来源：https://developer.mozilla.org/en-US/docs/Web/API/EventTarget.addEventListener#Multiple_identical_event_listeners

Answer 2

使用jquery，您可以在任何对象（此处为窗口）上使用data("events")：

var hasbeforeunload = $(window).data("events") && $(window).data("events").['beforeunload'];

但这只适用于jquery添加的事件。

在更一般的情况下，您应该只是存储您在某处添加侦听器的信息：

   var addedListeners = {};
   function addWindowListenerIfNone(eventType, fun) {
      if (addedListeners[eventType]) return;
      addedListeners[eventType] = fun;
      window.addEventListener(eventType, fun);
   }

我认为javascript中没有标准的方法来获取现有的事件处理程序。最好你可以附加Node的addEventListener函数来拦截和存储监听器，但我不推荐它......

编辑：

从jQuery 1.8开始，$._data(element, "events")中提供了事件数据。更改日志有一个应该考虑的警告：

  

请注意，这不是受支持的公共接口;实际数据   结构可能会因版本不同而发生变化。

Answer 3

在Chrome开发工具中，您可以检查附加到元素的所有事件（用于调试）-

// print all events attached to document
var eventObjectAttachedToDocument = getEventListeners(document);

for (var event in eventObjectAttachedToDocument) {
    console.log(event);
}