Question

我有一个这样的简单形式：

<form method="post" id="login">

Username: <input type="text" value="" name="usr" />
Password: <input type="password" value="" name="pw"/>
<input type="submit" id="log" name="log" value="Login" style="width:250px;"/><br/>

</form>

但我一直无法通过此行阅读我的javascript属性：

var usr = login.usr.value;
var pw = login.pw.value;

我收到此错误的原因是什么？

Answer 1

尝试为您的表单命名并更改您的代码，如下所示：

<form method="post" id="login" name="login">

Username: <input type="text" value="" name="usr" />
Password: <input type="password" value="" name="pw"/>
<input type="submit" id="log" name="log" value="Login" style="width:250px;"/><br/>

</form>

和你的javascript：

var usr = document.login.usr.value;

您可以查看here (jsfiddle link)。

Answer 2

<input type="text" value="" name="usr" />不会神奇地变成变量login.usr，您需要根据DOM定义值。

var usr = document.login.usr.value;

Answer 3

尝试使用getElementsByName：

getElementsByName()方法访问具有指定名称的所有元素。

var usr = document.getElementsByName('usr')[0].value;
var pw = document.getElementsByName('pw')[0].value;

http://jsfiddle.net/L3RvL/

Answer 4

方法1：

<form method="post" id="login">
  Username: <input type="text" value="" name="usr" />

var form = document.getElementById("login"); //DOM access
var usr = form.elements["usr"]; // Forms access

方法2 - 无效xhtml：

<form method="post" name="login">
  Username: <input type="text" value="" name="usr" />

var form = document.login; // Forms access
var usr = form.elements["usr"]; // Forms access

方法3：

<form method="post">
  Username: <input type="text" value="" name="usr" />

var usr = document.getElementsByName("usr")[0]; // first field on page named this

方法4： - 首选，因为ID必须是唯一的 - 如果页面上有更多需要相同验证的usr表单，则不太有用

<form method="post">
  Username: <input type="text" value="" id="usr" name="usr" />

var usr = document.getElementById("usr");

Answer 5

适用于所有浏览器：

   document.forms["login"].elements["usr"].value;
   document.forms["login"].elements["pw"].value;

无法读取未定义的属性“值”

5 个答案: