Назначение переменной для getElementById, не работает - PullRequest
Новая
       10

Назначение переменной для getElementById, не работает

4 голосов
/ 08 сентября 2011

Я пытался посмотреть на stackoverflow, но не могу найти ту же проблему, что и у меня - я уверен, что эту проблему легко решить, но почему-то ... она не работает.

У меня есть некоторые входы, которые будут добавлять / умножать / вычитать / делить и т. Д. В формате калькулятора. Что я хочу, так это удалить ненужные ссылки на getElementById, объявив переменные вне моего функционального блока (я не хочу каких-либо причудливых назначений множественного getElementById).

Мой Javascript ниже: 

//Declarations: designed to minimze calls to document.getElementByID
    var number1 = document.getElementById("num1");
    var number2 = document.getElementById("num2");
    var numAnswer = document.getElementById("answer");

    //Add together two numbers
    function add()
    {
        numAnswer.value = parseFloat(number1.value) + parseFloat(number2.value);
    }

Это сводит меня с ума - если я уберу переменные и просто использую старый document.getElementById, все работает. Это должно быть так просто, но это просто не работает. Я проверил орфографию, и все кажется нормальным - я что-то упускаю?

Ответы [ 2 ]

5 голосов
/ 08 сентября 2011

Это будет работать при условии, что скрипт, который вы показываете в своем вопросе, появляется после элементов в вашем источнике страницы.В противном случае браузер еще не проанализировал эти элементы, поэтому он не может найти их по идентификатору.

Другой способ заставить его работать - это выполнять назначения в обработчике onload или готовом к документу,потому что к моменту onload или готовности к документу все элементы доступны независимо от того, где они находятся в источнике страницы.

0 голосов
/ 08 сентября 2011

Ваш код работает отлично, поскольку вы включили его в свой вопрос.Вы можете видеть это здесь: http://jsfiddle.net/jfriend00/kXrDF/.

Это означает, что есть что-то еще не так, что вы не включили в свой вопрос.Возможно, вы можете включить больше своего кода, чтобы мы могли помочь вам найти, что еще может вызывать его.

Чтобы проверить область действия ваших «глобальных» переменных, вы можете установить точку останова в функции add ()и проверьте значения number1, number2 и numAnswer.Если вы еще не выяснили, как установить точку останова и проверить переменные, я настоятельно рекомендую это сделать.Если вы все еще не можете, то вы можете поместить временные тесты в ваш код add (), чтобы сузить суть проблемы: 

if (!number1) alert("number1 is not valid");
if (!number2) alert("number2 is not valid");
if (!numAnswer) alert("numAnswer is not valid");

Другая возможность состоит в том, что ваш код выполняется слишком рано, прежде чемстраница была загружена, и в этом случае исходный код не может найти элементы DOM, потому что они еще не существуют.Чтобы это не было проблемой, вам нужно убедиться, что ваш код не запускается до тех пор, пока страница не загрузится.Вы можете сделать это, поместив свой код после элементов страницы или используя один из различных методов для определения времени загрузки страницы и не запуская ваш код, который инициализировал ваши глобальные переменные до тех пор.Фреймворки, такие как jQuery и YUI, имеют встроенные функции, помогающие запускать код после загрузки страницы.

...