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

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/11430672/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-24 05:48:10  来源:igfitidea点击:

JavaScript - how to check if event already added

javascriptevent-listener

提问by Shlomo

I want to add an listener exactly once for beforeunload. This is my pseudocode:

我想为beforeunload. 这是我的伪代码:

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

But hasEventListenerdoes not exist obviously. How can I achieve this? Thanks.

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

采纳答案by Denys Séguret

Using jquery you can do use data("events")on any object (here the window) :

使用 jquery,您可以data("events")在任何对象(此处为窗口)上使用:

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

But this works only for jquery added events.

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

In a more general case, you should simply store the information that you add a listener somewhere :

在更一般的情况下,您应该简单地存储您在某处添加侦听器的信息:

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

I think there is no standard way in javascript to get the existing event handlers. At best you could surcharge the addEventListener function of Node to intercept and store the listeners but I don't recommend it...

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

EDIT :

编辑 :

From jQuery 1.8, event data are available in $._data(element, "events"). The change log has a warning that should be taken into account :

从 jQuery 1.8 开始,事件数据以$._data(element, "events"). 更改日志有一个警告,应该考虑:

Note that this is not a supported public interface; the actual data structures may change incompatibly from version to version.

请注意,这不是受支持的公共接口;实际的数据结构可能会因版本而异。

回答by user4584026

In fact there is no need to check if an listener was added to a target:

事实上,没有必要检查监听器是否被添加到目标:

If multiple identical EventListeners are registered on the same EventTarget with the same parameters, the duplicate instances are discarded. They do not cause the EventListener to be called twice, and since the duplicates are discarded, they do not need to be removed manually with the removeEventListener method.

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

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

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

回答by Varun Kumar

In Chrome Dev tool, you can check all events attached to an element (For debugging)-

在 Chrome Dev 工具中,您可以检查附加到元素的所有事件(用于调试)-

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

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

enter image description here

在此处输入图片说明