How to debug JavaScript/jQuery event bindings with Firebug?

Let’s say an event handler is attached to your element. For example,

$('#foo').click(function() { console.log('clicked!') });

Then you can debug it like this:

For jQuery 1.3.x

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

For jQuery 1.4.x

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

For jQuery 1.8.x+

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

Alex Onsman

Updated on: 14-Feb-2020

167 Views

Get certified by completing the course

Get Started