Is there any way to see what events are bound to an element with jQuery?
+1
A:
If you are using Safari or Chrome, you can open up the Developer Tools and inspect the element (by clicking the magnifying glass). In the Event Listeners tab on the right it will tell you the binded events to that element, with their functions and locations.
OR to do this via code:
$('selector').data('events'); // get
console.dir($('selector').data('events')); // display in firefox firebug or webkit's developer tools
balupton
2010-07-20 08:37:13
I've updated my question to include a code example to see the attached events.
balupton
2010-07-20 08:45:01
The developer tools from Chrome does it display the events binded with jQuery?
Adrian Crapciu
2010-07-20 08:54:34
Yep. Here is a screenshot:http://img830.imageshack.us/img830/1372/tmpu.pngI've also included in my answer how to fetch the listeners using javascript, so you don't need to use a browser console.
balupton
2010-07-20 09:11:28
Nice tool. Thanks a lot
Adrian Crapciu
2010-07-20 09:14:31
@Adrian - Make sure to accept this as the answer if it answered your question via the checkmark on the left :)
Nick Craver
2010-07-20 09:56:58
A:
If you don't need this in script, you can check that element in any DOM inspection tool like Firebug and see all events.
Māris Kiseļovs
2010-07-20 08:37:16
Yes, and with anything other. Also you can do the same with Chrome/Safari/Opera Developer Tools.
Māris Kiseļovs
2010-07-20 09:22:41
I must be blind but I can't find the Event Listener tab in Firebug. I use Firebug 1.5.4 and Firequery.
Adrian Crapciu
2010-07-20 09:41:33
Then you can check this discussion - http://stackoverflow.com/questions/570960/how-to-debug-javascript-jquery-event-bindings-with-firebug-or-similar-tool
Māris Kiseļovs
2010-07-20 09:48:50
it seems that the Events Panel is added from Firefox 3.7a1pre not in Firefox 3.6.*
Adrian Crapciu
2010-07-20 13:37:50