How to find event listeners on a DOM node when debugging or from the JavaScript code?

javascript events dom
Navneet picture Navneet · Jan 15, 2009 · Viewed 579.4k times · Source

I have a page where some event listeners are attached to input boxes and select boxes. Is there a way to find out which event listeners are observing a particular DOM node and for what event?

Events are attached using:

  1. Prototype's Event.observe;
  2. DOM's addEventListener;
  3. As element attribute element.onclick.

Answer

Andrew Hedges picture Andrew Hedges · Aug 6, 2010

If you just need to inspect what's happening on a page, you might try the Visual Event bookmarklet.

Update: Visual Event 2 available.

Related questions

Getting value of HTML Checkbox from onclick/onchange events

<input type="checkbox" onclick="onClickHandler()" onchange="onChangeHandler()" /> From within onClickHandler and/or onChangeHandler, how can I determine what is the new state of the checkbox?

Read More
How to stop event propagation with inline onclick attribute?

Consider the following: <div onclick="alert('you clicked the header')" class="header"> <span onclick="alert('you clicked inside the header');">something inside the header</span> </div> How can I make it so …

Read More
Javascript callback when IFRAME is finished loading?

I need to execute a callback when an IFRAME has finished loading. I have no control over the content in the IFRAME, so I can't fire the callback from there. This IFRAME is programmaticly created, and I need to pass …

Read More