document.ready 中的全局 javascript 变量


声明

全局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);

如果要声明全局变量,则可能需要使用某种类型的命名空间。 只需在外面声明命名空间,然后您就可以将任何您想要的内容放入其中。 喜欢这个。。。

var MyProject = {};
$(document).ready(function() {
    MyProject.intro = "";
    MyProject.intro = "something";
});
console.log(MyProject.intro); // "something"

声明这个

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 触发。

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

或者,为了使变量具有全局范围,请不要在变量之前使用关键字var如下所示。然而,通常这被认为是不好的做法,因为它污染了全球范围,但由您决定。

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

要了解更多信息,请查看:

  • 解释 JavaScript 范围和闭包

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

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

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

虽然你不能立即使用该变量,但它可以被其他函数访问

像这样:准备好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>');
            }
        }
    });
});

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

<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(){});

在 ready 函数中使用 window.intro = "value";。 如果您希望"value" undefined,则可以void 0

相关内容

  • 没有找到相关文章

最新更新