Глобальная переменная Javascript не работает должным образом?

Question

Мой код JQuery:

$(document).ready(function() {
    chrome.extension.sendRequest({get: "height"}, function(response) {
        height = response.value;
    });

    $("#id").css("height", height+"px");
});

Вам не нужно беспокоиться о chrome.extension.sendRequest(), в основном он связывается с фоновой страницей для получения значения "height" из localStorage и сохраняет значение в глобальной переменной height.

Проблема заключается в том, что $("#id") не присвоено значение высоты. Однако, если бы я изменил его так, чтобы оно было сейчас:

$(document).click(function() {
    $("#id").css("height", height+"px");
});

это работает. Есть идеи почему?

Answer 1

Причина в том, что когда вы откладываете назначение на щелчок документа, это означает, что запрос успевает завершиться, и задаете значение высоты.

В вашем первом примере высота не имеет значения ввремя назначения.Причина в том, что тело функции, переданное в sendRequest, выполняется не сразу, а сохраняется до завершения запроса.После этого функция вызывается.Но до этого javascript продолжит выполнение вашего оператора $("#id")....Чтобы удостовериться, что ему не присвоено значение до его появления, измените его на следующее:

$(document).ready(function() {
    chrome.extension.sendRequest({get: "height"}, function(response) {
        height = response.value;
        $("#id").css("height", height+"px");
    });
});

Теперь, если функция обратного вызова, переданная в sendRequest, выполняется в контексте, где этот код не можетбыть выполненным, как и в случае с расширениями браузера, вам, возможно, придется вместо этого передать ссылку на объект:

$(document).ready(function() {
    var myObj = $("#id");
    chrome.extension.sendRequest({get: "height"}, function(response) {
        height = response.value;
        myObj.css("height", height+"px");
    });
});

Но я бы пошел с первой версией, если это работает.

Когда вы применили это, выясните, нужно ли по-прежнему сохранять глобальную переменную height ...