2

Is there any way to view DOM level 2 event listeners added to a DOM element in IE 9+?

In Chrome, we can see attached events from console using getEventListeners(object).

I tried Visual Events, but it only displays DOM level 0 events.

In case if you are wondering, I need to list the attached event handlers to window unload event and debug which events are fired to find out which one is causing an exception/preventing propagation. The unload event handler is getting dispatched properly in Chrome.

Brian Tompsett - 汤莱恩
  • 5,753
  • 72
  • 57
  • 129
Sen Jacob
  • 3,384
  • 3
  • 35
  • 61
  • 1
    [have a look at this question](http://stackoverflow.com/questions/2623118/inspect-attached-event-handlers-for-any-dom-element) – Kevin Kloet Nov 21 '16 at 09:04

1 Answers1

3

Yes, you can easily see DOM2 handlers:

  • Right-click the element with the event handler and choose Inspect Element

  • That should trigger the DOM Explorer tab; if not, do so

  • Pick the Events tab on the right-hand side

It lists the event handlers attached to the element, including DOM2 ones.

For instance, using this fiddle:

<div id="target">
I have a DOM2 event handler.
</div>

function thisIsADOM2Handler() {
    this.style.color = "green";
}
document.getElementById("target").addEventListener("click", thisIsADOM2Handler, false);

I followed the steps above to see this:

enter image description here

I need to list the attached event handlers to window unload event

You'll find the handlers for the window unload event listed on the body element, so navigate there in the DOM Inspector to see them:

enter image description here

T.J. Crowder
  • 1,031,962
  • 187
  • 1,923
  • 1,875