Глобальная переменная javascript внутри document.ready

Question

Как правильно объявить глобальную переменную 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);

Answer 1

Если вы объявляете глобальную переменную, вы можете использовать какое-то пространство имен. Просто объявите пространство имен снаружи, тогда вы можете добавить в него все, что захотите. Как это...

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

    MyProject.intro = "something";
});

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

Answer 2

Объявить это

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 ready функция (в настоящее время вы) будет входить в систему undefined, но в готовом DOM это даст вам истину / ложь.

Ваш внешний console.log выполнить до готовности DOM выполнить, потому что DOM ready выполнить после того, как все ресурсы появились в 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,

Answer 3

JavaScript имеет область видимости переменных уровня функций, что означает, что вам придется объявлять переменную вне $(document).ready() функция.

Или же, чтобы ваша переменная имела глобальную область видимости, просто не используйте var Ключевое слово перед ним, как показано ниже. Однако в целом это считается плохой практикой, потому что это загрязняет глобальный охват, но решать вам.

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

---

Чтобы узнать больше об этом, проверьте:

• Объясняя объем JavaScript и замыкания

Answer 4

Использование window.intro Внутри $(document).ready(),

Answer 5

Вы можете определить переменную внутри функции готовности документа без var, чтобы сделать ее глобальной переменной. В JavaScript любой переменной, объявленной без var автоматически становится глобальной переменной

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

хотя вы не можете использовать переменную сразу, но она будет доступна для других функций

Answer 6

Как это: положить 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>');
            }
        }
    });
});

Answer 7

В отличие от других языков программирования, любая переменная, объявленная вне какой-либо функции, автоматически становится глобальной,

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

Answer 8

Использование window.intro = "value"; внутри готовой функции. "value" может быть void 0 если вы хотите, чтобы это было undefined