CODEWITHSUNDEEP
javascriptfunction
Ben Dauphinee
Ben Dauphinee

Reputation: 4181

Is there any way to trace back a javascript function call?

I need a definitive way to figure out what Javascript is modifying a form value? The best I've been able to do is: 

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

But the value has not been changed by the point that this executes.

Upvotes: 8

Views: 13058

Answers (4)

Bjorn
Bjorn

Reputation: 71850

There's a new way to do this in Chrome and Firefox: console.trace

See here:

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

In 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 modify the accepted answer:

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

Upvotes: 18

osahyoun
osahyoun

Reputation: 5231

The following will show you what event handlers have been bound to a element:

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

Upvotes: 1

Simeon
Simeon

Reputation: 5579

Insert 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 into the above JS method. Hit it and take a look at the stacktrace.

Upvotes: 2

ParPar
ParPar

Reputation: 7549

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"); 
    }
 }

Upvotes: -1

Related Questions