1

我的 HTML 页面中有以下 JavaScript 引用页面上的 HTML 表单:

<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 之后。

4

3 回答 3

10

你使用的是什么浏览器?

一般来说,您永远不应该使用document.*访问权限。这是一个 MS-IE 约定。相反,使用

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

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

正如 outis 所指出的,要么将你的脚本块放在页面底部,要么使用onload<body> 标签的事件,像这样

<script>
function go()
{
    alert( "The DOM has been assembled and can be accessed.. nOW!!!" ) ;
    var myForm = document.getElementById( 'myForm' ) ; // ...
}
</script>
<body onload="go() ;">
</body>
于 2010-05-03T13:15:10.623 回答
7

你的问题在document.myForm. 您可能想使用:

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

更新:其他答案还发现了另外几个问题:

正如 bobobobo 在另一个答案中指出的那样,您也应该使用document.getElementById()for myForm.myInput。此外,outis 还遇到了另一个问题,因为您应该将<script>块放置在 HTML 文档的末尾附近,就在结束</body>标记之前。否则,您的脚本将在表单插入 DOM 之前执行。

于 2010-05-03T13:10:35.327 回答
7

如果示例代表页面,则在评估脚本时表单“myForm”不存在。除了使用document.getElementById(or ) 之外,您还需要延迟设置,直到处理完表单元素之后,或者更好的是,将表单作为参数传递给函数,而不是使用全局变量。document.forms.formNamevar myForm

于 2010-05-03T14:06:05.883 回答