【发布时间】：2011-02-03 07:34:09
【问题描述】：
不幸的是 form.reset() 函数不会重置表单的隐藏输入。 已签入 FF3 和 Chromium。
有没有人知道如何重置隐藏字段？
【问题讨论】：
-
我猜这是为了保留 CSRF 令牌
标签： javascript forms reset
【发布时间】：2011-02-03 07:34:09
【问题描述】：
似乎最简单的方法是使用 display: none 文本字段而不是隐藏字段。 在这种情况下，默认重置过程会定期进行。
【讨论】：
-
在 Cordova 应用程序中工作 - Jquery Mobile 1.4.5
这是正确的as per the standard，不幸的是。一个糟糕的规格疣 IMO。尽管如此，IE 还是为隐藏字段提供了可重置的defaultValue。请参阅this discussion：它不会（唉）在 HTML5 中发生变化。
（幸运的是，很少需要重置表单。作为 UI 功能，它通常不受欢迎。）
由于您根本无法获得 value 属性的原始值，因此您必须将其复制到另一个属性中并获取它。例如：
<form id="f">
<input type="hidden" name="foo" value="bar" class="value=bar"/>
function resetForm() {
var f= document.getElementById('f');
f.reset();
f.elements.foo.value= Element_getClassValue(f.elements.foo, 'value');
}
function Element_getClassValue(el, classname) {
var prefix= classname+'=';
var classes= el.className.split(/\s+/);
for (var i= classes.length; i-->0;)
if (classes[i].substring(0, prefix.length)===prefix)
return classes[i].substring(prefix.length);
return '';
}
将该值偷运到其中的其他方法可能包括 HTML5 data、另一个备用属性（如 title）、用于读取值的紧随其后的 <!-- comment -->、显式附加 JS 信息或仅用于保存的额外隐藏字段默认值。
无论采用哪种方法，都必须使 HTML 变得混乱；它不能在文档准备就绪时由脚本创建，因为到该代码执行时，某些浏览器已经用记住的值（来自重新加载或后退按钮）覆盖了字段的值。
【讨论】：
-
+1 您可以轻松地为此实现通用解决方案，例如绑定到所有表单的重置事件一个选择
$('input:hidden')并检查data-default属性的处理程序。 -
我倾向于使用 form.reset() 一次清除多个字段的值...以避免重置每个字段的所有额外代码。这与 UI 无关，而与使用内置函数有关，显然它并没有完成我想的所有事情。我本可以发誓过去已经清除了隐藏字段，但这次讨论证明我的记忆错误。
-
@Somna：它们曾经是，仅在 IE 中。
另一个答案，以防有人来这里寻找答案。 在页面加载后序列化表单并使用这些值稍后重置隐藏字段：
var serializedForm = $('#myForm').serialize();
然后，重置表单：
function fullReset(){
$('#myForm').reset(); // resets everything except hidden fields
var formFields = decodeURIComponent(serializedForm).split('&'); //split up the serialized form into variable pairs
//put it into an associative array
var splitFields = new Array();
for(i in formFields){
vals= formFields[i].split('=');
splitFields[vals[0]] = vals[1];
}
$('#myForm').find('input[type=hidden]').each(function(){
this.value = splitFields[this.name];
});
}
【讨论】：
我发现在加载文档时设置默认值然后捕获重置并将隐藏的小狗重置回其原始值更容易。例如，
//fix form reset (hidden fields don't get reset - this will fix that pain in the arse issue)
$( document ).ready(function() {
$("#myForm").find("input:hidden").each(function() {
$(this).data("myDefaultValue", $(this).val());
});
$("#myForm").off("reset.myarse");
$("#myForm").on("reset.myarse", function() {
var myDefaultValue = $(this).data("myDefaultValue");
if (myDefaultValue != null) {
$(this).val(myDefaultValue);
}
});
}
希望这可以帮助某人:)
【讨论】：
-
优秀的解决方案。每次调用reset函数都会清除隐藏字段，不用每次都记得清除值。
您可以使用 jQuery - 这将清空隐藏字段：
$('form').on('reset', function() {
$("input[type='hidden']", $(this)).val('');
});
提示：请确保您没有重置 csrf 令牌字段或其他任何不应清空的内容。如果需要，您可以缩小元素的规格。
如果您想将该字段重置为可以使用的默认值（未测试）：
$('form').on('reset', function() {
$("input[type='hidden']", $(this)).each(function() {
var $t = $(this);
$t.val($t.data('defaultvalue'));
});
});
并将默认值保存在data-defaultvalue="Something" 属性中。
【讨论】：
$('#form :reset').on('click',function(e)({
e.preventDefault();
e.stopImmediatePropagation();
$("#form input:hidden,#form :text,#form textarea").val('');
});
对于 select、checkbox、radio，最好知道（保持）默认值，并在该事件处理程序中将它们设置为默认值。
【讨论】：
-
您可能需要确保您的目标是 $('#form input[type="hidden"]) 而不仅仅是 input:hidden 的元素（由于 CSS 不可见），如果您有隐藏的按钮，这些将被设为空白。
-
这是错误的！重置表单并不意味着使其元素的值等于 null 或清空其字段，它意味着返回页面完全加载时出现的值。
创建一个按钮并将 JavaScript 添加到清除字段的 onClick 事件。
也就是说，我很好奇您为什么要重置这些字段。通常，它们包含内部数据。如果我在我的代码中清除它们，表单的发布就会失败（例如在用户输入新数据并尝试提交表单之后）。
[编辑] 我误解了你的问题。如果您担心有人可能篡改隐藏字段中的值，则无法重置它们。例如，您可以在表单上调用reset()，但不能在表单中的某个字段上调用。
您可能认为您可以将值保存在 JavaScript 文件中并使用它来重置值，但是当用户可以篡改隐藏字段时，他也可以篡改 JavaScript。
所以从安全的角度来看，如果你需要重置隐藏字段，那么首先要避免它们，并将信息保存在服务器上的会话中。
【讨论】：
这样就可以了：
$("#form input:hidden").val('').trigger('change');
【讨论】：
-
这是错误的！重置表单并不意味着使其元素的值等于 null，或者清空其字段，它意味着返回页面完全加载时出现的值
您可以使用下面的行重置隐藏的输入字段值，您只需要更改表单 ID 而不是 frmForm。
$("#frmForm input:hidden").val(' ');
【讨论】：
-
您可以使用上面的行重置隐藏的输入字段值。您只需要更改 frmForm 的表单 ID。