JavaScript: How to find out which functions are called on event?

Question

I have a problem, there is a website with a load of JS code. When I click on a certain element, some functions are called. How can I find out which functions (and in which files)?

For example, there's something like this

$( document ).ready(function() {
   $("a").on('click', function() { $('c').css('opacity', '0.8'); });
   $("ul#main li a").on('click', function() { $('c').toggle('.menu'); });
   $("nav a").on('click', function() { callSomeFunctions(); });
});

And then I've got a menu like this

<nav><ul><li><a href="#">click</a></li></ul></nav>

How can I find out that those 3 lines above are executed?

Thanks!

score 1 · Accepted Answer · answered Feb 10 '14 at 19:20

1

I always use this tool to see what events are linked to DOM elements http://www.sprymedia.co.uk/article/visual+event

answered Feb 10 '14 at 19:20

HP Bruna

613
4
8

score 0 · Answer 2 · answered Feb 10 '14 at 20:07

There are many ways. But as a beginner i would like to just add alert in each function:

$( document ).ready(function() {
   $("a").on('click', function() { $('c').css('opacity', '0.8'); alert('inside first'); });
   $("ul#main li a").on('click', function() { $('c').toggle('.menu');  alert('inside first');      });
   $("nav a").on('click', function() { callSomeFunctions(); alert('inside first'); });
});

Also, working link: http://jsfiddle.net/wRZN6/

JavaScript: How to find out which functions are called on event?

2 Answers2