<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title> <script type="text/javascript" src="jquery/jquery-1.8.0.min.js"></script> <script type="text/javascript" src="jquery/jquery-1.8.0.js"></script> <script type="text/javascript"> $(function(){ $("#res").click(function(){ $(".div").remove(); }); }); </script> </head> <body> <form method="post" action=""> <div class="int"> <label for="username">用户名:</label> <input type="text" id="username" class="required" /> </div> <div class="int"> <label for="email">邮箱:</label> <input type="text" id="email" class="required" /> </div> <div class="int"> <label for="personinfo">个人资料:</label> <input type="text" id="personinfo" /> </div> <div class="sub"> <input type="submit" value="提交" id="send" /> <input type="reset" id="res" value="重置" /> </div> </form> </body> </html>
上面这段代码,当我点击重置时,input中的文字会清空,这是为什么?
jquery api对remove的解释是:不会把匹配的元素从jQuery对象中删除,因而可以在将来再使用这些匹配的元素。但除了这个元素本身得以保留之外,其他的比如绑定的事件,附加的数据等都会被移除。在我写的html中,其实并没有使用“.div”这个类,也就是并没有匹配到input,那input的内容为什么会清空?
你f12看下,找不到就报错,然后这个单击事件就无效了,执行重置。仅供参考,经验乱说
谢谢,我想到了。reset自带有清空功能的