document.ready中的全局javascript变量

时间:2012-06-22 08:50:30

标签: javascript jquery global-variables scope

哪种方式可以声明全局javascript变量?我正在尝试它的方式不起作用

$(document).ready(function() {

    var intro;

    if ($('.intro_check').is(':checked')) {
        intro = true;
        $('.intro').wrap('<div class="disabled"></div>');
    };

    $('.intro_check').change(function(){
        if(this.checked) {
            intro = false;
            $('.enabled').removeClass('enabled').addClass('disabled');
        } else {
            intro = true;
            if($('.intro').exists()) {
                $('.disabled').removeClass('disabled').addClass('enabled'); 
            } else {
                $('.intro').wrap('<div class="disabled"></div>');
            }
        }
    });
});

console.log(intro);

8 个答案:

答案 0 :(得分:72)

如果要声明全局变量,则可能需要使用某种命名空间。只需在外部声明命名空间,然后就可以将任何想要的东西扔进去。像这样......

var MyProject = {};
$(document).ready(function() {
    MyProject.intro = "";

    MyProject.intro = "something";
});

console.log(MyProject.intro); // "something"

答案 1 :(得分:30)

声明这个

var intro;

$(document).ready()之外,因为$(document).ready()会将您的变量隐藏在全局范围内。

<强>代码

var intro;

$(document).ready(function() {
    if ($('.intro_check').is(':checked')) {
        intro = true;
        $('.intro').wrap('<div class="disabled"></div>');
    };
    $('.intro_check').change(function(){
        if(this.checked) {
            intro = false;
            $('.enabled').removeClass('enabled').addClass('disabled');
        } else {
            intro = true;
            if($('.intro').exists()) {
                $('.disabled').removeClass('disabled').addClass('enabled'); 
            } else {
                $('.intro').wrap('<div class="disabled"></div>');
            }
        }
    });
});

根据@Zakaria评论

另一种方式:

window.intro = undefined;

$(document).ready(function() {
    if ($('.intro_check').is(':checked')) {
        window.intro = true;
        $('.intro').wrap('<div class="disabled"></div>');
    };
    $('.intro_check').change(function(){
        if(this.checked) {
            window.intro = false;
            $('.enabled').removeClass('enabled').addClass('disabled');
        } else {
            window.intro = true;
            if($('.intro').exists()) {
                $('.disabled').removeClass('disabled').addClass('enabled'); 
            } else {
                $('.intro').wrap('<div class="disabled"></div>');
            }
        }
    });
});

注意

console.log(intro);

在DOM就绪函数之外(目前你已经)会记录undefined,但在DOM准备好之前它会给你真/假。

你的外部console.log在DOM就绪执行之前执行,因为DOM准​​备好在所有资源出现在DOM之后执行,即在DOM准备好之后,所以我认为你总是会得到荒谬的结果。


根据@ W0rldart的评论

  

我需要在DOM就绪函数之外使用它

您可以使用以下方法:

var intro = undefined;

$(document).ready(function() {
    if ($('.intro_check').is(':checked')) {
        intro = true;
        introCheck();
        $('.intro').wrap('<div class="disabled"></div>');
    };
    $('.intro_check').change(function() {
        if (this.checked) {
            intro = true;
        } else {
            intro = false;
        }
        introCheck();
    });

});

function introCheck() {
    console.log(intro);
}

更改intro的值后,我调用的函数将使用新值intro触发。

答案 2 :(得分:15)

JavaScript具有功能级变量范围,这意味着您必须在$(document).ready()函数之外声明您的变量。

或者,要使变量具有全局范围,只需使用var关键字,如下所示。但通常这被视为不良做法,因为它污染全局范围,但由您自行决定。

$(document).ready(function() {
   intro = null; // it is in global scope now

要了解有关它的更多信息,请查看:

答案 3 :(得分:7)

window.intro内使用$(document).ready()

答案 4 :(得分:2)

像这样:把intro放在你的文件之外,这里的讨论很好:http://forum.jquery.com/topic/how-do-i-declare-a-global-variable-in-jquery @thecodeparadox非常快:P无论如何!

 var intro;

$(document).ready(function() {



    if ($('.intro_check').is(':checked')) {
        intro = true;
        $('.intro').wrap('<div class="disabled"></div>');
    };

    $('.intro_check').change(function(){
        if(this.checked) {
            intro = false;
            $('.enabled').removeClass('enabled').addClass('disabled');
        } else {
            intro = true;
            if($('.intro').exists()) {
                $('.disabled').removeClass('disabled').addClass('enabled'); 
            } else {
                $('.intro').wrap('<div class="disabled"></div>');
            }
        }
    });
});

答案 5 :(得分:2)

与其他编程语言不同,在任何函数外声明的任何变量都会自动变为全局,

<script>

//declare global variable
var __foo = '123';

function __test(){
 //__foo is global and visible here
 alert(__foo);
}

//so, it will alert '123'
__test();

</script>

你的问题是你在ready()函数中声明了变量,这意味着它只在ready()函数内可见(在范围内),但不在外面,

解决方案: 因此,只需将其设为全局,即在$(document).ready(function(){});

之外声明这个

答案 6 :(得分:1)

在就绪功能中使用window.intro = "value";。如果您希望"value"

,则void 0可以是undefined

答案 7 :(得分:1)

您可以在没有var的文档就绪函数内定义变量,使其成为全局变量。在javascript中,任何声明为var的变量都会自动变为全局变量

$(document).ready(function() {
    intro =  "something";
});

虽然您无法立即使用该变量,但其他功能可以访问