<!DOCTYPE html>
<html lang="en">
<head>
<script type="text/javascript" src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script type="text/javascript" src="http://oss.maxcdn.com/jquery.form/3.50/jquery.form.min.js"></script>
<meta charset="UTF-8">
</head>
<body>
<form id="myForm" action="save" method="post">
<input type="hidden" name="id" id="id">
姓名: <input type="text" name="name" value="111"/> <br/>
年龄: <input type="text" name="age" size="20"><br />
自我介绍: <textarea name="comment" class="special"></textarea> <br/>
单选:男<input type="radio" name="a" value="111" checked/>
女<input type="radio" name="a" value="222"/><br/>
<input type="button" id="test1" value="重置所有表单" /> <br/>
<input type="button" id="test2" value="清除所有表单" />
<input type="button" id="test3" value="reset()" /><br/>
</form>
<script type="text/javascript">
//重置表单(重置至初始状态)
$('#test1').click(function(){
$("#id").val(6);//隐藏域不能重置 有默认值的重置成默认值 textarea radio text
$("#myForm").resetForm();
console.log($("#myForm").serialize())//id=6&name=111&age=&comment=&a=111
})
//清除表单
$('#test2').click(function(){
$("#id").val(8);
$('#myForm').clearForm();
console.log($("#myForm").serialize())//id=8&name=&age=&comment= 发现单选框以前选中的,也被清除了,跟重置有点区别!
})
//清除表单(和resetForm()作用差不多)
$('#test3').click(function(){
document.getElementById("myForm").reset();//等同于$("#myForm")[]0].reset();
console.log($("#myForm").serialize())//id=&name=111&age=&comment=&a=111
})
</script>
</body>
</html>
clearForm(): 清除表单元素。该方法将所有的text、password、textarea置空,清除select元素中的选定,以及所有radio按钮和checkbox按钮重置为非选定状态
formSerialize(): 将表单序列化成查询串。这个方法将返回一个形如: name1=value1&name2=value2的字符串。
<script src="http://malsup.github.io/min/jquery.form.min.js"></script>
<script src="//oss.maxcdn.com/jquery.form/3.50/jquery.form.min.js"></script>
<script src="http://malsup.github.io/jquery.form.js" type="text/javascript"></script>