为什么html表单上的重置按钮不会重置隐藏字段？答案

【问题标题】：Why does the reset button on html forms not reset hidden fields?为什么html表单上的重置按钮不会重置隐藏字段？
【发布时间】：2011-06-16 06:12:18
【问题描述】：

我发现了一些令人惊讶的事情：

<html>
<head>
<script type="text/javascript">
function f()
{
document.getElementById("h").value++;
document.getElementById("x").value++;
}
</script>
</head>
<body>

<form>
<input type="hidden" name="hidden" id="h" value="5"/>
<input type="text" id="x" value="5"/>
<input name='clear' type='reset' id='clear' value='Clear'>
</form>

<button type="button" onclick="f()">Increment</button>
<button type="button" onclick="alert(document.getElementById('h').value)">Show hidden</button>

</body>
</html>

在 Firefox 4.0.1 中尝试此操作，单击清除始终会将文本输入重置为 5，但从不重置隐藏字段。

我（和其他人）根本没想到会出现这种行为：我们预计隐藏值也会被重置！

谁能指出解释为什么隐藏输入被重置按钮区别对待的文档或规范？

也欢迎解释为什么这种行为是可取的。

【问题讨论】：

重置后隐藏字段的值是多少？
@Oltarus 与重置前相同。例如。如果我点击“增量”按钮 5 次，它变成 10，点击重置后保持 10。
stackoverflow.com/questions/2559616/…w3.org/Bugs/Public/show_bug.cgi?id=8506

标签： html forms reset hidden-field

【解决方案1】：

FWIW，我想我可以从答案和 cmets 中整理出完整的故事。

使用原理：清除按钮用于清除用户输入，由于用户无法直接访问隐藏输入，因此允许用户重置隐藏输入没有任何意义价值。

文档和行为： AR 指出的bug report 明确说明了正在发生的事情：隐藏字段的value 的模式是default，正如specs 中所预期的那样。
特别是，这意味着更改值（如问题中的示例代码）会更改默认值，而重置按钮会将输入字段重置为默认值，因此没有更改。
文本输入的行为是不同的（即使它的值也以编程方式更改），因为它的value 的模式不是默认而是value，这意味着输入的默认值和当前值。

【讨论】：

【解决方案2】：

用户无法看到或修改隐藏字段，因此他们无法通过按下按钮来清除它。

【讨论】：

【解决方案3】：

单击重置时，浏览器会检查 DOM 树中的默认值，而不是 HTML 页面中的默认值。

您的 Javascript 修改了 DOM。您应该尝试将 RESET 按钮替换为调用 Javascript 的自定义按钮，该 Javascript 执行两件事：

正常复位。
将隐藏字段设置为5。

【讨论】：

很有趣，所以document.getElementById("x").value++; 不会为文本输入更新 DOM 中的值。
@trutheality 嗯，我没看到。忘记原因，我不是100％肯定。但解决方案有效。

【解决方案4】：

我来到这里是因为我遇到了同样的问题。然而，经过进一步思考，这（通常）是一种非常理想的行为。

隐藏字段最常用于存储页面加载时服务器发送的信息。

虽然它也可以被脚本用来输入一些运行时计算的条目，但在不希望的情况下重置隐藏字段可能会导致麻烦。

【讨论】：