2010-05-03 2 views
1

У меня есть следующие JavaScript в моей HTML страницы ссылок в HTML-форму на странице:Почему мои переменные JavaScript не сохраняются в разных функциях?

<script type="text/javascript"> 
<!-- 

var myForm = document.myForm; 

function validateForm() { 
    if (myForm.myInput == "") 
     alert("Please input some text."); 

     return false; 
    } 

    myForm.submit(); 
} 

function showFormInput() { 
    myForm.reset(); 

    document.getElementById('myInput').style.display = 'inline'; 
} 

//--> 
</script> 

... 

<form name="myForm" id="myForm" action="..." method="post"> 
    <input id="myInput" name="myInput" type="text" value="" style="display:none;" /> 
</form> 

Обе функции метания исключение при попытке доступа к переменной myForm, говоря, что «Myform является недействительным или не является объектом ». Почему это происходит?

ОБНОВЛЕНИЕ: Одна вещь, которую я думаю, что я собираюсь из этого, состоит в том, что глобальные переменные обычно должны использоваться для строковых литералов, а не элементов в DOM. Я "собираюсь идти вперед с этим, и использовать переменные элемента экономно, и только после того, как был загружен DOM

ответ

10

Какой браузер вы используете?

В общем, вы никогда не должны использовать доступ document.*. Это соглашение MS-IE. Вместо этого используйте

var myForm = document.getElementById('myForm') ; 
var myInput = document.getElementById('myInput') ; 

if(myInput.value == '') 
{ 
    // its empty! 
} 

Как отметил outis, либо поставить блок сценария в нижней части страницы, либо использовать onload событие < тела > тега, как этот

<script> 
function go() 
{ 
    alert("The DOM has been assembled and can be accessed.. nOW!!!") ; 
    var myForm = document.getElementById('myForm') ; // ... 
} 
</script> 
<body onload="go() ;"> 
</body> 
+0

+1 для того, чтобы поймать другую проблему :) –

+0

Спасибо. Я собираюсь избежать документа. * С этого момента. –

7

Ваша проблема заключается в document.myForm Вы можете использовать:..

var myForm = document.getElementById('myForm'); 

ОБНОВЛЕНИЕ: другие ответы пойманы еще пару вопросов:

As bobobobo noted in another answer, вы должны использовать document.getElementById() для myForm.myInput, а Кроме того 44441698833839. 4452627058888, так как вы должны разместить свой блок <script> ближе к концу вашего документа HTML, как раз перед закрывающим тегом </body>. В противном случае ваш скрипт будет выполняться до того, как форма будет вставлена ​​в DOM.

+0

Вы избили меня к нему +1 –

7

Если образец представитель страницы, форма «myForm» не существует, когда скрипт оценивается. В дополнение к использованию document.getElementById (или document.forms.formName) вам потребуется отложить установку var myForm до тех пор, пока элемент элемента формы не будет обработан или, better yet, передайте форму как аргумент функции, а не используя глобальную переменную.

+0

+1 хороший улов ... –

+0

Я думал, что это может быть проблемой. Это имеет смысл. Спасибо. –