我有一个标准的重置按钮的形式编码如下:

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

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

我在想,附加一个jQuery函数循环所有的字段和清除他们'手动'将做的技巧。我已经在使用jQuery的形式,但我只是刚刚赶上速度&所以我不知道如何做到这一点,除了单独引用每个字段的ID,这似乎不是很有效。

请TIA帮忙。


当前回答

简单地这样做

$('#myform')[0].reset();

更多的信息

如果你有这样的输入,设置myinput.val(")可能不能100%模拟"reset":

<input name="percent" value="50"/>

例如,在一个默认值为50的输入上调用myinput.val(")会将其设置为空字符串,而调用myform.reset()则会将其重置为初始值50。

其他回答

我用的是Paolo Bergantino的解决方案,它很棒,但做了一些调整……特别是使用表单名称代替id。

例如:

function jqResetForm(form){
   $(':input','form[name='+form+']')
   .not(':button, :submit, :reset, :hidden')
   .val('')
   .removeAttr('checked')
   .removeAttr('selected');
}

现在当我想用它的时候

<span class="button" onclick="jqResetForm('formName')">Reset</span>

如你所见,这适用于任何表单,因为我使用css样式来创建按钮,页面在单击时不会刷新。再次感谢Paolo的建议。唯一的问题是,如果我在表单中有默认值。

我使用下面的解决方案,它为我工作(混合传统javascript和jQuery)

$("#myformId").submit(function() {
    comand="window.document."+$(this).attr('name')+".reset()";
    setTimeout("eval(comando)",4000);
})

这里有一些东西可以让你开始

$('form') // match your correct form 
.find('input[type!=submit], input[type!=reset]') // don't reset submit or reset
.val(''); // set their value to blank

当然,如果你有复选框/单选按钮,你将需要修改这包括他们以及设置。attr({'checked': false});

编辑 Paolo的回答更加简洁。我的回答更啰嗦,因为我不知道:input选择器,也没有想过简单地删除选中的属性。

修改$(document).ready()情况投票最多的答案:

$('button[type="reset"]').click(function(e) {
    $form = $(this.form);
    $form.find('input:text, input:password, input:file, select, textarea').val('');
    $form.find('input:radio, input:checkbox').removeAttr('checked').removeAttr('selected');
    e.preventDefault();
});

2012年3月更新。

所以,在我最初回答这个问题的两年后,我回头看看,它已经变成了一个大混乱。我觉得是时候回到这个问题上来,让我的答案真正正确了,因为它得到了最多的好评和接受。

For the record, Titi's answer is wrong as it is not what the original poster asked for - it is correct that it is possible to reset a form using the native reset() method, but this question is trying to clear a form off of remembered values that would remain in the form if you reset it this way. This is why a "manual" reset is needed. I assume most people ended up in this question from a Google search and are truly looking for the reset() method, but it does not work for the specific case the OP is talking about.

我最初的回答是这样的:

// 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, select, textarea').val('');
    $form.find('input:radio, input:checkbox')
         .removeAttr('checked').removeAttr('selected');
}

// to call, use:
resetForm($('#myform')); // by id, recommended
resetForm($('form[name=myName]')); // by name

jQuery认为,单独使用:text、:radio等选择器是一种糟糕的做法,因为它们最终会求值为*:text,这会花费比正常情况下更长的时间。我确实更喜欢白名单的方法,希望我在最初的回答中使用了它。无论如何,通过指定选择器的输入部分,加上表单元素的缓存,这应该使它成为这里性能最好的答案。

如果人们默认的选择元素不是一个空值的选项,那么这个答案可能仍然有一些缺陷,但它肯定是通用的,这将需要根据具体情况进行处理。