无法通过在javascript中使用表单名称来获取表单元素

时间:2010-10-13 19:24:38

标签: javascript forms

我在使用它的名称访问我的表单时遇到问题。当我使用document.form [0] .mylink.value时,它识别值并输出到我指定的innerHTML。但是,当我使用document.myform.mylink.value时,它似乎无法识别表单。我已经在chrome 6.0和firefox 3.6.3中尝试了这个,并在两者中得到了相同的结果。我真的需要能够使用表单名称(而不是document.form [0])访问我的表单值,任何想法为什么document.myform.mylink.value不起作用?

<form name="myform">
<table>
<tr><td valign="middle" align="center">
    <div id="textResponse"></div>
</td></tr>
<tr><td height="30" valign="middle" align="center">
    <input name="mylink" value="Enter a URL" size="31" />
</td></tr>
<tr><td valign="top" align="center">
    <a href="javascript:submitForm2();">Click</a>
</td></tr>
</table>
</form>

<script type="text/javascript">
function submitForm2(){
    //This one does NOT work:
    my_link = document.myform.mylink.value;
    //This one also does NOT work:
    //my_link = document.forms['myform'].mylink.value;
    //This one works:
    //my_link = document.forms[0].mylink.value;

    document.getElementById("textResponse").innerHTML="<p>"+my_link+"</p>";
}
</script>

1 个答案:

答案 0 :(得分:19)

从技术上讲,你所拥有的应该可以正常工作......下面的完整语法也应该有效:

var my_link = document.forms['myform'].elements['mylink'].value;

如果您的“真实”代码中的变量偶然是"mylink" 而不是 "my_link",您将在IE中失败,因为它会自动引用表单元素,而不是你试图提取的价值。

所有人都说,您的代码已发布 ... 在Firefox / IE中运行良好(此处演示:http://jsfiddle.net/Ymg8W/