[JQuery] 真正意义上清空表单内容
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>执行结果:
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>点击重置按钮前:
点击重置按钮后:
得出结论: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”的按钮前:
点击"id=button"的按钮后:
郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。