Переменная недоступна при инициализации вне функции - PullRequest
Новая
       3

Переменная недоступна при инициализации вне функции

40 голосов
/ 18 февраля 2010

Когда я использую такой код, он работает нормально: 

function removeWarning() {
    var systemStatus = document.getElementById("system-status");
    systemStatus.innerHTML = "";
}

function indicateInvalidUsername() {
    var systemStatus = document.getElementById("system-status");
    systemStatus.innerHTML = "Invalid username";
}

Однако, когда я хочу переместить systemStatus в глобальную переменную, он не работает: 

var systemStatus = document.getElementById("system-status");

function removeWarning() {
    systemStatus.innerHTML = "";
}

function indicateInvalidUsername() {
    systemStatus.innerHTML = "Invalid username";
}

Что мне здесь делать?

Ответы [ 7 ]

38 голосов
/ 18 февраля 2010

Это действительно зависит от того, где находится ваш код JavaScript.

Проблема, вероятно, вызвана тем, что DOM не загружается, когда строка 

var systemStatus = document.getElementById("system-status");

выполнено. Вы можете попробовать вызвать это в событии onload или в идеале использовать событие типа DOM ready из среды JavaScript.

27 голосов
/ 18 февраля 2010

Убедитесь, что вы объявили переменную на «корневом» уровне, вне каких-либо блоков кода.

Вы также можете полностью удалить var, хотя это не рекомендуется и выдаст «строгое» предупреждение.

Согласно документации на MDC , вы можете устанавливать глобальные переменные, используя window.variablename.

6 голосов
/ 18 февраля 2010

Объявите systemStatus во внешней области и назначьте его в обработчике загрузки. 

systemStatus = null;

function onloadHandler(evt) {
    systemStatus = document.getElementById("....");
}

Или, если вам не нужен обработчик загрузки, поместите тег сценария внизу HTML.

6 голосов
/ 18 февраля 2010

Я предполагаю, что элемент system-status объявляется после запуска объявления переменной. Таким образом, в то время, когда переменная объявлена, она фактически устанавливается в нуль?

Вы должны только объявить его, а затем присвоить его значение из обработчика onLoad, потому что тогда вы будете уверены, что он правильно инициализировал (загрузил) рассматриваемый элемент.

Вы также можете попробовать поместить скрипт внизу страницы (или хотя бы где-нибудь после объявления элемента system-status), но он не всегда будет работать.

4 голосов
/ 11 декабря 2012

Эта статья является ответом на такие проблемы!;) Прочитай внимательно!

2 голосов
/ 02 октября 2012

Чтобы определить глобальную переменную, основанную на элементе DOM, необходимо проверить несколько вещей. Во-первых, если код находится в разделе <head>, DOM не будет загружен при выполнении. В этом случае обработчик события должен быть размещен для установки переменной после загрузки DOM, например: 

var systemStatus;
window.onload = function(){ systemStatus = document.getElementById("system_status"); };

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

<div id="system_status"></div>
<script type="text/javascript">
 var systemStatus = document.getElementById("system_status");
</script>

В результате последнего примера большинство страниц, на которых выполняются сценарии в теле, сохраняют их до самого конца документа. Это позволит загрузить страницу, а затем выполнить javascript, что в большинстве случаев визуально ускоряет визуализацию DOM.

2 голосов
/ 18 февраля 2010

Глобальная переменная лучше всего выражается во внешнем файле JavaScript: 

var system_status;

Убедитесь, что это больше нигде не использовалось. Затем, чтобы получить доступ к переменной на вашей странице, просто обратитесь к ней как таковой. Скажем, например, вы хотели заполнить результаты в текстовом поле, 

document.getElementById("textbox1").value = system_status;

Чтобы убедиться, что объект существует, используйте функцию готовности документов jQuery.

Пример: 

$(function() {
    $("#textbox1")[0].value = system_status;
});
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Похожие темы

...