Firebug debugging JavaScript

Question

Is there a way I can attach the debugger to an event?

I have a checkbox input element in my DOM and when it's clicked, I'd like the debugger to break so I can step through what's happening. I've added onclick="debugger; ...", but Firebug doesn't break.

• Sergio Cinos: I suggest to take a look to Eventbug (getfirebug.com/wiki/index.php/Firebug_Extensions#Eventbug). I don't know if you can do what you request using Eventbug, but certanly has lots of options to view event handlers, log events in the console...

Answer 1

Create an onclick handler for the checkbox, and add a breakpoint to that handler. For example (jQuery):

$('input#mycheckbox').click(function() {
 console.log("click checkbox");
});

In firebug you can add a breakpoint to the console.log line.

Answer 2

Find the javascript line in firebug and set a breakpoint. You should'nt need to modify your Javascript at all.

Check out this page, specifically the "Pause execution on any line" section to see what this looks like visually.

• JamesBrownIsDead: Well that's the thing--there is no JavaScript line.
• Kenan Banks: Then set a breakpoint on the first line of the event handler.