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

最新推荐文章于 2023-09-08 14:44:27 发布

转载最新推荐文章于 2023-09-08 14:44:27 发布 · 112 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/i6010/articles/4947686.html

文章标签：

#javascript #ViewUI

本文详细解析了JQuery中的:not()选择器的定义与常见用法，并通过示例展示了如何利用该选择器与其他选择器结合进行DOM元素操作。进一步，文章阐述了HTML DOM reset()方法的作用并非清空元素值，而是还原值，同时提供了真正的清空表单内容的方法，以及如何通过jQuery实现。最后，文章还介绍了如何使用jQuery清空表单中特定类型的输入元素。

JQuery :not() 选择器

定义与用法：

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

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

参考代码：

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

Hello

Hello Again

执行结果：

HTML DOM reset() 方法或是元素

参考代码：

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

点击重置按钮前：

点击重置按钮后：

得出结论：HTML DOM reset() 方法或是元素的真正作用并不是“清空” 元素中的 value值，而是“重置”还原元素中的原本的 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>

option1 option2