CODEWITHSUNDEEP
javascriptjqueryconsole
Mircea Voivod
Mircea Voivod

Reputation: 721

Console access to Javascript variables local to the $(document).ready function

How can I access some variables inside 

$(document).ready(function(){
    var foo=0;
    var bar = 3;
});

from Google chrome console? If I try alert(foo), I will get a message that it is not defined.

Upvotes: 26

Views: 42496

Answers (8)

Eric Herlitz
Eric Herlitz

Reputation: 26287

Why not do a proper expose variable ?

$(document).ready(function(){
    var foo=0;
    var bar = 3;

    $.exposed = {
        foo: foo,
        bar: bar
    }
});

Check your variables by doing 

console.log($.exposed.bar)

Upvotes: 17

trias
trias

Reputation: 665

Actually there is a hackish way around it. You should probably not use it. Set a Breakpoint. That being said, here's the code:

$(document).ready(
    readyClosure = function(access){
        var x = 5; 
        return eval(access);
    }
);
readyClosure('x'); // returns 5

Upvotes: 0

Yanick Rochon
Yanick Rochon

Reputation: 53546

If you really need to access these variables from different parts of your code (initialize them on document ready, then accessing them elsewhere, for example), then you have to declare them outside the function closure.

If and only if this is the case, I'm not a fan of cluttering the global space. I would suggest you to use a base object for that :

var myObj = {};

$(function() {
   myObj.foo = 0;
   myObj.bar = 3;
});

Note that they will only be set once the document is loaded! Therefore alert(myObj.foo); (or something similar) place immediately after the $(function() { ... }); block will yield undefined!

If you only need to access them inside that context, then do not declare anything outside the function. And try to debug your code with other methods. With chrome, console.log is quite helpful, for instance.

Upvotes: 4

Florian Margaine
Florian Margaine

Reputation: 60767

Put a breakpoint with the debugger. You'll get full access to them when the debugger will stop.

Other answers telling you to put them in the global scope are bad. Don't use bad practices just because you don't know how to use the right tools.

Upvotes: 51

Stefan
Stefan

Reputation: 14863

You can't since the are in a closure space. Here it explains how closure works (How do JavaScript closures work? ). To access the varible just set a breakpoint inside the $(document).ready function

Upvotes: 5

jtheman
jtheman

Reputation: 7491

define them outside of $(document).ready() and then access them inside as well.

var foo = 0, bar = 3;
$(document).ready(function(){
    alert(foo);
});

Upvotes: 1

Vytautas Butkus
Vytautas Butkus

Reputation: 5535

$(document).ready(function(){
    window.foo=0;
    window.bar = 3;
});

You expose those vars into global scope(really not advised)

Upvotes: 2

Xophmeister
Xophmeister

Reputation: 9211

You can't access these variables because they are defined within a functional closure. The only way you could do it is if you made a global reference to them outside your function's scope.

var foo, bar;

$(document).ready(function(){
    foo = 0;
    bar = 3;
});

Upvotes: 20

Related Questions