how to determine which JavaScript events are being triggered

Question

As the title says, how can I find what JavaScript events are being triggered as I interact with a webpage?

• Cedric: Visual Event, sprymedia.co.uk/article/Visual+Event . I am sure that that will help half of the people landing on this stackoverflow page :)

Answer 1

when you have firebug installed, the following functions will gather data of all the javascript functions being triggered, and how much time is spent executing them:

console.profile([title])

Turns on the JavaScript profiler. The optional argument title would contain the text to be printed in the header of the profile report.

console.profileEnd()

Turns off the JavaScript profiler and prints its report.

More info can be found at http://getfirebug.com/console.html

• hoju: that profiler is awesome, but it seems to print which functions are executed rather than which events are being triggered (click, mouseover, etc)
• Chuck Kollars: For a simple answer, it may work to just browse to ckollars.org/browser-events.html and see what messages you get. Exactly which events you get sometimes depends on the browser and the browser version; try to avoid "too tight" coding.

Answer 2

Firebug extension of firefox is a great piece of software to let you know about that and many other things. Also here are couple of links to help you:

Debugging JavaScript events with Firebug

http://www.dustindiaz.com/event-capturing-evil/

• hoju: how do you watch events with firebug?

Answer 3

All these posts are useful , firebug of course , and I suggest from personal experience this screen-cast helped me , its called "event delegation in jquery"

Answer 4

Use the Stack Tab in Firebug. Put a debugger somewhere , and in the Script tab , at the right hand side , there are three tabs also . Look at the Stack tab to see the details.