Is there any way to track javascript function call?

Question

Do I need a definitive way to find out that Javascript is changing the value of a form? The best I could do was:

$(function(){ console.log($("input[name=Email]").val()); }); 

But the value has not been changed by the point at which it is executed.

Answer 1

Chrome and Firefox have a new way: console.trace

Look here:

https://developer.mozilla.org/en-US/docs/Web/API/console.trace

In the web inspector:

 > console.trace() console.trace() VM251:2 (anonymous function) VM251:2 InjectedScript._evaluateOn VM223:581 InjectedScript._evaluateAndWrap VM223:540 InjectedScript.evaluate VM223:459 undefined 

So, to change the accepted answer:

 $('input#myInputAbove').change(function(){ console.trace(); // No breakpoint needed anymore. }); 

Answer 2

Paste this directly below the HTML of the form element you want to trace:

 $('input#myInputAbove').change(function(){ console.log('change detected'); // Breakpoint on this line }); 

Use FireBug to insert a breakpoint in the above JS method. Catch him and look at the stack.

Answer 3

The following shows which event handlers are bound to an element:

 $.each($("input[name='Email']").data('events'), function(i, event){ $.each(event, function(i, handler){ console.log( handler.handler ); }); }); 

Answer 4

 prev_value = document.getElementByName('Email').value; $("input[name=Email]").change(function(){ var cur_value = document.getElementById('Email').value; if(cur_value != prev_value){ alert("Value changed"); //or console.log("Value changed"); } }