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.

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.