使用jQuery重置多阶段表单

Question

使用jQuery重置多阶段表单

我有一个带有标准重置按钮的表单，编码如下：

<input type="reset" class="button standard" value="Clear" />

问题是，所谓的表单是多阶段排序的，所以如果用户填写了一个阶段，然后稍后返回，各个字段的“记住”值将不会在单击“清除”按钮时重置。

我认为，附加一个jQuery函数来循环所有字段并“手动”清除它们就可以了。我已经在表单中使用了jQuery，但只是跟上了速度&所以我不知道如何做到这一点，除了通过ID单独引用每个字段之外，这似乎不太有效。

蒂娅需要任何帮助。

Answer 1

在我最初回答这个问题的两年后，我回来发现这个问题已经变成了一团乱。我觉得是时候回过头来，让我的答案真正正确，因为它是最令人兴奋的+接受。为了记录在案，Titi的回答是错误的，因为这不是最初的海报所要求的-使用本机Reset()方法重置表单是正确的，但是这个问题是试图清除表单中的记住值，如果您以这种方式重置的话，这些值将保留在表单中。这就是为什么需要“手动”重置。我想大多数人最终都会在Google搜索中问到这个问题，并且正在真正地寻找Reset()方法，但对于OP所讨论的具体情况，它不起作用。我的原版答案是：// not correct, use answer below$(':input','#myform').not(':button, :submit, :reset, :hidden').val('').removeAttr('checke在我最初回答这个问题 的两年后，我回来发现这个问题已经变成了一团乱。我觉得是时候回过头来，让我的答案真正正确，因为它是最令人兴奋的+接受。为了记录在案，Titi的回答 是错误的，因为这不是最初的海报所要求的-使用本机Reset()方法重置表单是正确的，但是这个问题是试图清除表单中的记住值，如果您以这种方式重置的话， 这些值将保留在表单中。这就是为什么需要“手动”重置。我想大多数人最终都会在Google搜索中问到这个问题，并且正在真正地寻找Reset()方法，但对于OP 所讨论的具体情况，它不起作用。我的原版答案是：// not correct, use answer below$(':input','#myform').not(':button, :submit, :reset, :hidden ').val('').removeAttr('checked').removeAttr('selected');这可能适用于许多情况，包括OP，但正如注释和其他答案中所指出的，它将清除任何值属性中的 收音机/复选框元素。更多对，是这样答案(但不完美)是：function resetForm($form) {    $form.find('input:text, input:password, input:file, selec t, textarea').val('');    $form.find('input:radio, input:checkbox')         .removeAttr('checked').removeAttr('selected');}// to call, use :resetForm($('#myform')); // by id, recommendedresetForm($('form[name=myName]')); // by name使用:text, :radio等，选择器本身被jQuery认为是 错误的实践，因为它们最终评估为*:text这使得它花费的时间比它应该花的时间要长得多。我确实更喜欢白名单的方法，并希望我在我最初的答案中使用它。 无论如何，通过指定input选择器的一部分，加上Form元素的缓存，这将使它成为这里性能最好的答案。如果人们对SELECT元素的默认设置不是一个具有空白 值的选项，那么这个答案可能仍然有一些缺陷，但是它肯定是一个通用的选项，而且它将需要逐个案例地处理。d').removeAttr('selected');这可能适用于许多情况，包括OP，但正如注释和其他答案中所指出的，它将清除任何值属性中的收音机/复选框元素。更多对，是这样答案(但不完美)是：function resetForm($form) {     $form.find('input:text, input:password, input:file, select, textarea').val('');     $form.find('input:radio, input:checkbox')          .removeAttr('checked').removeAttr('selected');}// to call, use:resetForm($('#myform'));           // by id, recommendedresetForm($('form[name=myName]')); // by name使用:text, :radio等，选择器本身被jQuery认为是错误的实践，因为它们最终评估为*:text这使得它花费的时间比它应该花的时间要长得多。我确实更喜欢白名单的方法，并希望我在我最初的答案中使用它。无论如何，通过指定input选择器的一部分，加上Form元素的缓存，这将使它成为这里性能最好的答案。如果人们对SELECT元素的默认设置不是一个具有空白值的选项，那么这个答案可能仍然有一些缺陷，但是它肯定是一个通用的选项，而且它将需要逐个案例地处理。

Answer 2

保罗接受的答案有一个很大的问题。考虑：$(':input','#myform') &nbsp;.not(':button,&nbsp;:submit,&nbsp;:reset,&nbsp;:hidden') &nbsp;.val('') &nbsp;.removeAttr('checked') &nbsp;.removeAttr('selected');这个.val('')行也将清除任何value被分配到复选框和单选按钮。所以如果你(像我一样)做这样的事情：<input&nbsp;type="checkbox"&nbsp;name="list[]"&nbsp;value="one"&nbsp;/><input&nbsp;type="checkbox"&nbsp;name="list[]"&nbsp;value="two"&nbsp;checked="checked"&nbsp;/> <input&nbsp;type="checkbox"&nbsp;name="list[]"&nbsp;value="three"&nbsp;/>使用已接受的答案将您的输入转换为：<input&nbsp;type="checkbox"&nbsp;name="list[]"&nbsp;value=""&nbsp;/><input&nbsp;type="checkbox"&nbsp;name="list[]"&nbsp;value=""&nbsp;/><input&nbsp;type="checkbox"&nbsp;name="list[]"&nbsp;value=""&nbsp;/>噢-我在用那个值！下面是一个修改后的版本，它将保留复选框和无线电值：//&nbsp;Use&nbsp;a&nbsp;whitelist&nbsp;of&nbsp;fields&nbsp;to&nbsp;minimize&nbsp;unintended&nbsp;side&nbsp;effects.$('INPUT:text,&nbsp;INPUT:password,&nbsp;INPUT:file,&nbsp;SELECT,&nbsp;TEXTAREA',&nbsp;'#myFormId') .val('');&nbsp;&nbsp;//&nbsp;De-select&nbsp;any&nbsp;checkboxes,&nbsp;radios&nbsp;and&nbsp;drop-down&nbsp;menus$('INPUT:checkbox,&nbsp;INPUT:radio',&nbsp;'#myFormId').removeAttr('checked') .removeAttr('selected');