jquery的form插件使用--form.clearForm()/resetForm()

最新推荐文章于 2024-04-07 13:15:26 发布

qq_31459039

最新推荐文章于 2024-04-07 13:15:26 发布

阅读量2.6k

点赞数 1

分类专栏：前端

本文链接：https://blog.csdn.net/qq_31459039/article/details/90520731

版权

前端专栏收录该内容

18 篇文章 0 订阅

订阅专栏

<!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的字符串。

qq_31459039

关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
jquery的form插件使用--form.clearForm()/resetForm()

<!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" s...
复制链接

扫一扫

专栏目录