How to find a Javascript function if it is event handler?

Question

I want use Chrome developer tool to add a break point to js function to debug it.

For example, a function "buttonAlert()" is binded to a button.

But I don't know where the code of such function, and I don't know where the code that bind the function to button.

So, how can I use the tool to find out the location of function and binding code?

Answer 1

It is actually possible to see event listeners in chrome. Go to the elements panel, select the element in question and click on Event Listeners on the right side.

Sadly most of the time when jQuery is in use, you only see the part of the source of jQuery that bound the event, not the one that called jQuery.