使用 jQuery 清除表单字段
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/6364289/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Clear form fields with jQuery
提问by tbuehlmann
I want to clear all input and textarea fields in a form. It works like the following when using an input button with the reset
class:
我想清除表单中的所有输入和文本区域字段。在reset
类中使用输入按钮时,它的工作方式如下:
$(".reset").bind("click", function() {
$("input[type=text], textarea").val("");
});
This will clear all fields on the page, not just the ones from the form. How would my selector look like for just the form the actual reset button lives in?
这将清除页面上的所有字段,而不仅仅是表单中的字段。对于实际的重置按钮所在的表单,我的选择器会是什么样子?
回答by ngen
For jQuery 1.6+:
对于 jQuery 1.6+:
$(':input','#myform')
.not(':button, :submit, :reset, :hidden')
.val('')
.prop('checked', false)
.prop('selected', false);
For jQuery < 1.6:
对于 jQuery < 1.6:
$(':input','#myform')
.not(':button, :submit, :reset, :hidden')
.val('')
.removeAttr('checked')
.removeAttr('selected');
Please see this post: Resetting a multi-stage form with jQuery
请参阅此帖子: 使用 jQuery 重置多阶段表单
Or
或者
$('#myform')[0].reset();
As jQuery suggests:
正如 jQuery 所建议的:
To retrieve and change DOM properties such as the
checked
,selected
, ordisabled
state of form elements, use the .prop()method.
检索和更改DOM属性,如
checked
,selected
或disabled
元素形式的元素状态,使用.prop()方法。
回答by ShaneBlake
$(".reset").click(function() {
$(this).closest('form').find("input[type=text], textarea").val("");
});
回答by user768680
Any reason this shouldn't be used?
有什么理由不应该使用它?
$("#form").trigger('reset');
回答by parapura rajkumar
This won't handle cases where form input fields have non empty default values.
这不会处理表单输入字段具有非空默认值的情况。
Something like should work
类似的东西应该工作
$('yourdiv').find('form')[0].reset();
回答by Lukas Liesis
if you use selectors and make values to empty values, it is not resetting the form, it's making all fields empty. Reset is to make form as it was before any edit actions from user after the load of form from server side. If there is an input with name "username" and that username was prefilled from server side, most of solutions on this page will delete that value from input, not reset it to the value how it was before user's changes. If you need to reset the form, use this:
如果您使用选择器并将值设为空值,则不会重置表单,而是将所有字段设为空。重置是在从服务器端加载表单后,使表单与用户进行任何编辑操作之前一样。如果有一个名为“username”的输入并且该用户名是从服务器端预填充的,则此页面上的大多数解决方案将从输入中删除该值,而不是将其重置为用户更改之前的值。如果您需要重置表单,请使用以下命令:
$('#myform')[0].reset();
if you need not to reset the form, but fill all inputs with some value, for example empty value, then you can use most of the solutions from other comments.
如果您不需要重置表单,而是使用某个值填充所有输入,例如空值,那么您可以使用其他评论中的大多数解决方案。
回答by jroi_web
Simple but works like a charm.
简单但工作起来就像一个魅力。
$("#form").trigger('reset'); //jquery
document.getElementById("myform").reset(); //native JS
回答by Tarmo Saluste
If someone is still reading this thread, here is the simplest solution using not jQuery, but plain JavaScript. If your input fields are inside a form, there is a simple JavaScript reset command:
如果有人还在阅读这个帖子,这里是最简单的解决方案,不是使用 jQuery,而是使用纯 JavaScript。如果您的输入字段在表单内,则有一个简单的 JavaScript 重置命令:
document.getElementById("myform").reset();
More about it here: http://www.w3schools.com/jsref/met_form_reset.asp
更多关于它的信息:http: //www.w3schools.com/jsref/met_form_reset.asp
Cheers!
干杯!
回答by apen
$('form[name="myform"]')[0].reset();
回答by Matt Ball
Why does it need to be done with any JavaScript at all?
为什么它需要用任何 JavaScript 来完成?
<form>
<!-- snip -->
<input type="reset" value="Reset"/>
</form>
http://www.w3.org/TR/html5/the-input-element.html#attr-input-type-keywords
http://www.w3.org/TR/html5/the-input-element.html#attr-input-type-keywords
Tried that one first, it won't clear fields with default values.
首先尝试了那个,它不会清除具有默认值的字段。
Here's a way to do it with jQuery, then:
这是一种使用 jQuery 实现的方法,然后:
$('.reset').on('click', function() {
$(this).closest('form').find('input[type=text], textarea').val('');
});
回答by Rashi Goyal
If you want to empty all input boxes irrespective of its type then it's a minute step by
如果您想清空所有输入框而不管其类型,那么只需一步
$('#MyFormId')[0].reset();