Question

我正在网站上工作，遇到了这个问题，所以我尽可能简化了。

的index.html：

<html>
<head></head>
<body>
    <script type="text/javascript" src="test.js"></script>

    <form id="myForm" onsubmit="log(this.id)">
        <input name="id">
    </form>
</body>
</html>

test.js：

function log(str){
    console.log("str=" + str);
}

当我提交表单时，我看到了：

str = [object HTMLInputElement]

当我将name的值更改为除“id”之外的任何内容时，我看到了预期的

STR = myForm会

如果我在代码中切换“name”和“id”的所有实例，我会得到完全相同的行为。换句话说，它似乎不是任何属性的特定限制，而是更通用的东西。

我在OS X 10.8上运行MAMP;在Firefox 22.0和Chrome版本中遇到问题。 28。

提前致谢

Answer 1

表单元素上的.id按名称访问表单字段。要获取ID属性，请使用this.getAttribute('id')。

Answer 2

当你给输入命名为“id”时，log（this.id）转换为log（myForm.id），其中id是myForm的属性，它实际上是输入子元素。这由出现的[object HTMLInputElement]类名表示。

当您将输入子控件命名为其他内容时this.id现在引用窗体id属性。

当您使用“name”切换“id”时，同样的逻辑适用，因为您可以通过名称或ID来引用控件。

Answer 3

嗯，那是因为this.id被解释为“名称为id的元素属于表单”，这就是为什么你要收到[对象HTMLInputElement ]通过参数。如果没有这样的输入（即当您以不同方式命名时），this.id将被解释为表单ID 。

HTML表单onsubmit传递this.id;产生意想不到的价值

3 个答案: