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

Когато използвам код като този, той работи добре:

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";
}

Какво трябва да правя тук?


javascript global-variables
person Nick Heiner    schedule 18.02.2010    source източник
comment
Предполагам, че вашият script таг е в горната част на страницата, така че когато се изпълни, document.getElementById("system-status") връща null, защото все още не съществува, тъй като DOM се анализира...   -  person Christian C. Salvadó    schedule 18.02.2010

Отговори (6)


arrow_upward
38
arrow_downward

Това наистина зависи от това къде се намира вашият JavaScript код.

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

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

се изпълнява. Можете да опитате да извикате това в събитие при зареждане или в идеалния случай да използвате събитие от готов тип DOM от рамка на JavaScript.

person MLefrancois    schedule 18.02.2010
comment
+1 Това вероятно е вашият проблем. Вашият синтаксис (изолирано, така или иначе) трябва да работи добре. - person Ben Zotto; 18.02.2010
comment
Поставянето на скрипта в края на вашия html също може да работи, но определено не е най-секси решението :) - person MLefrancois; 20.02.2010
comment
Понякога не разбирам общността на SO: казах, че проблемът е условие за състезание в предложения ми отговор и той беше отхвърлен... и сега виждам, че приетият отговор всъщност е условие за състезание... - person jldupont; 21.02.2010

arrow_upward
27
arrow_downward

Уверете се, че сте декларирали променливата на "основно" ниво, извън всички кодови блокове.

Можете също така да премахнете var напълно, въпреки че това не се препоръчва< /a> и ще изведе "строго" предупреждение.

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

person Pekka    schedule 18.02.2010

arrow_upward
6
arrow_downward

Предполагам, че елементът system-status се декларира, след като се изпълни декларацията на променливата. По този начин, когато променливата е декларирана, тя всъщност е зададена на нула?

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

Можете също да опитате да поставите скрипта в долната част на страницата (или поне някъде след декларирането на елемента system-status), но не е гарантирано, че винаги ще работи.

person lc.    schedule 18.02.2010

arrow_upward
6
arrow_downward

Декларирайте systemStatus във външен обхват и го присвоете в манипулатор при натоварване.

systemStatus = null;

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

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

person NG.    schedule 18.02.2010

arrow_upward
2
arrow_downward

Глобалната променлива би била най-добре изразена във външен JavaScript файл:

var system_status;

Уверете се, че това не е използвано никъде другаде. След това, за да получите достъп до променливата на вашата страница, просто я посочете като такава. Кажете, например, че искате да попълните резултатите в текстово поле,

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

За да сте сигурни, че обектът съществува, използвайте функцията за готов документ на jQuery.

Пример:

$(function() {
    $("#textbox1")[0].value = system_status;
});
person Danny G    schedule 18.02.2010
comment
Тиретата не са законни знаци в имената на променливи. Механизмът на JavaScript ще търси две променливи, system и status, и ще се опита да върне разликата, тъй като интервалът няма значение при работа с двоични оператори (т.е.: 5 - 3 е същото като 5-3). - person Christopher Parker; 18.02.2010

arrow_upward
2
arrow_downward

За да дефинирате глобална променлива, която е базирана на 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.

person Travis J    schedule 02.10.2012