How to debug JavaScript / jQuery event bindings with Firebug or similar tools?

by

See How to find event listeners on a DOM node.

In a nutshell, assuming at some point an event handler is attached to your element (eg): $('#foo').click(function() { console.log('clicked!') });

You inspect it like so:

  • jQuery 1.3.x

    var clickEvents = $('#foo').data("events").click;
jQuery.each(clickEvents, function(key, value) {
  console.log(value) // prints "function() { console.log('clicked!') }"
})

  • jQuery 1.4.x

    var clickEvents = $('#foo').data("events").click;
jQuery.each(clickEvents, function(key, handlerObj) {
  console.log(handlerObj.handler) // prints "function() { console.log('clicked!') }"
})

See jQuery.fn.data (where jQuery stores your handler internally).

  • jQuery 1.8.x

    var clickEvents = $._data($('#foo')[0], "events").click;
jQuery.each(clickEvents, function(key, handlerObj) {
  console.log(handlerObj.handler) // prints "function() { console.log('clicked!') }"
})

More Related Contents:

  1. Alternative to jQuery’s .toggle() method that supports eventData?
  2. Why is ‘event’ available globally in Chrome but not Firefox?
  3. jQuery .on() method doesn’t see new elements
  4. Javascript: function doesnt work even though condition is met (hard for me to explain)
  5. Check if an image is loaded (no errors) with jQuery
  6. jQuery $(document).ready and UpdatePanels?
  7. Getting value of select (dropdown) before change
  8. Long Press in JavaScript?
  9. Event when user stops scrolling
  10. How to detect online/offline event cross-browser?
  11. jQuery scroll() detect when user stops scrolling
  12. Fire jQuery event on div change
  13. How to bind Events on Ajax loaded Content?
  14. Event delegation vs direct binding when adding complex elements to a page
  15. HTML5 dragleave fired when hovering a child element
  16. Detect Close windows event by jQuery
  17. window.resize event firing in Internet Explorer
  18. jQuery change event on not firing in IE
  19. How to detect if the user clicked the “back” button
  20. jQuery: $().click(fn) vs. $().bind(‘click’,fn);
  21. jQuery event that triggers after CSS is loaded?
  22. Implementing jQuery’s “live” binder with native Javascript
  23. Drop event not firing in chrome
  24. jQuery: more than one handler for same event
  25. Prevent firing focus event when clicking on div
  26. submit event does not fire if submit initiated programmatically
  27. Catch scrolling event on overflow:hidden element
  28. Trigger for span text/html on changed
  29. Cancel click event in the mouseup event handler
  30. Is My Page Being Loaded from the Browser Cache?

Leave a Comment