How to check if any JavaScript event listeners/handlers attached to an element/document?

JavascriptJqueryDom Events

Javascript Problem Overview


Tried to search online, but does not look like I can formulate search query properly.

How can I, either with jQuery or just javascript list all the handlers or event listeners that are attached to element(s)/document/window or present in DOM?

Javascript Solutions


Solution 1 - Javascript

In jQuery before 1.8, try using $("#element").data("events")

EDIT:

There is also jQuery extension: listHandlers

Solution 2 - Javascript

When debugging, if you want to just see if there's an event, I recommend using Visual Event or the Elements" section of Chrome's Developer Tools: select an element and look for "Event Listeners on the bottom right.

In your code, if you are using jQuery before version 1.8, you can use:

$(selector).data("events")

to get the events. As of version 1.8, this is discontinued (see this bug ticket). You can use:

$._data(element, "events")

but this is not recommended since it is an internal jQuery structure, and could change in future releases.

This question has some answers which may be useful, but none of them are particularly elegant in the same way that $(selector).data("events") was.

Solution 3 - Javascript

Without jQuery:

if the listeners were added using elem.addEventListener() method, it is not easy to list these listeners. You can override the EventTarget.addEventListener() method by wrapping it with your own. Then you will have the information, what listeners were registered.

var f = EventTarget.prototype.addEventListener; // store original
EventTarget.prototype.addEventListener = function(type, fn, capture) {
  this.f = f;
  this.f(type, fn, capture); // call original method
  alert('Added Event Listener: on' + type);
}

Working example you can find at http://jsfiddle.net/tomas1000r/RDW7F/

Solution 4 - Javascript

I just discovered visual event 2:

http://www.sprymedia.co.uk/article/Visual+Event+2

go under the "make it go section" and drag the text link to your bookmark toolbar go to a page that has events and click on the bookmark

tested in FF Mac

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionGnrlBzikView Question on Stackoverflow
Solution 1 - JavascriptLaimoncijusView Answer on Stackoverflow
Solution 2 - JavascriptLukeView Answer on Stackoverflow
Solution 3 - JavascriptTomas JakubcoView Answer on Stackoverflow
Solution 4 - JavascriptMarkView Answer on Stackoverflow