码迷,mamicode.com
首页 > Web开发 > 详细

[JQuery] 真正意义上清空表单内容

时间:2014-12-09 09:27:46      阅读:155      评论:0      收藏:0      [点我收藏+]

标签:jquery   form   reset   清空表单内容   重置表单内容   

JQuery :not() 选择器

定义与用法:

:not() 选择器选取除了指定元素以外的所有元素。

最常见的用法:与其他选择器一起使用,选取指定组合中除了指定元素以外的所有元素。

参考代码:

		<script>
			$(function() {
				$("p:not(#p1)").css("color", "red"); //写法一
				$("p").not("#p1").css("color", "red"); //写法二
			})
		</script>

		<p id="p1">Hello</p>
		<p id="p2">Hello Again</p>
执行结果:

bubuko.com,布布扣

HTML DOM reset() 方法或是 <input type="reset"> 元素

参考代码:

		<script>
			$(function() {
				$("#form1 :input").val("value");
			})
		</script>

		<form id="form1">
			<input type="text" value="text" />
			<input type="reset" value="reset" />
		</form>
点击重置按钮前:

bubuko.com,布布扣

点击重置按钮后:

bubuko.com,布布扣
得出结论:HTML DOM reset() 方法或是 <input type="reset"> 元素的真正作用并不是“清空” <input> 元素中的 value值,而是“重置”还原 <input> 元素中的原本的 value 值。值得注意的是,reset 不能重置按钮类型元素(type=button,reset,submit)的 value 值。


真正清空 form 表单中的内容(JQuery)

参考代码:

		<script>
			$(function() {
				$("#button").click(function() {
					$("#form :input").not(":button, :submit, :reset, :hidden").val("").removeAttr("checked").remove("selected");//核心
				});
			})
		</script>

		<form id="form">
			<input type="radio" checked="checked" />
			<input type="checkbox" checked="checked" />
			<select>
				<option>option1</option>
				<option selected="selected">option2</option>
			</select>
			<input type="text" value="text" />
			
			<input type="hidden" value="hidden" />
			<input type="button" value="button" />
			<input type="reset" value="reset" />
			<input type="submit" value="submit" />
		</form>

		<button id="button">真正清空</button>
点击“id=button”的按钮前:

bubuko.com,布布扣

点击"id=button"的按钮后:

bubuko.com,布布扣

[JQuery] 真正意义上清空表单内容

标签:jquery   form   reset   清空表单内容   重置表单内容   

原文地址:http://blog.csdn.net/u011506951/article/details/41810517

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!