使用jQuery提交后清除表格

问题描述：

刷新后清除此表单的最简单方法是什么？我尝试过的方式将清除表单，但不会提交到数据库。别人可以向我解释做这件事的最好方法吗？使用jQuery提交后清除表格

<html> 
<head> 
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"></script> 
    <script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.9/jquery.validate.min.js"></script> 
    <script type="text/javascript"> 
    jQuery(document).ready(function($){ 
     $("#newsletterform").validate({ 
      debug: false, 
      rules: { 
       name: "required", 
       email: { 
        required: true, 
        email: true 
       } 
      }, 
      messages: { 
       name: "Please let us know who you are.", 
       email: "A valid email will help us get in touch with you.", 
      }, 
      submitHandler: function(form) { 
       // do other stuff for a valid form 
       $.post('newsletter.php', $("#newsletterform").serialize(), function(data) { 
        $('#results').html(data); 
       }); 

      } 

     }); 
    }); 

    </script> 

</head> 

<div id="content"> 
    <div id="newsletter-signup"> 
     <h1>Sign up for News, Updates, and Offers!</h1> 
     <form id="newsletterform" action="" method="post"> 

      <fieldset> 

       <ul> 
        <li> 
         <label for="name">Name:</label> 
         <input type="text" name="name" /> 
        </li> 
        <li> 
         <label for="email">Email:</label> 
         <input type="text" name="email" /> 
        </li> 
         <div id="results"><div> 
        <li> 
         <input type="submit" value="submit" name="signup" onclick="" />   
        </li> 
       </ul> 

      </fieldset> 

     </form>   
    </div> 
</div> 
</html>

答

您可以从$.post

$('#newsletterform').each(function(){ 
    this.reset(); 
});

这增加了回调你可以用”请致电$('#newsletterform').reset()，因为.reset()是一个表单对象，而不是一个jquery对象，或者是这个效果。你可以在页面下半部分阅读更多关于here的信息。

谢谢你这个工作。我的错误是我没有意识到我把它放在错误的位置。谢谢你真正解释你的答案。 – Kelbizzle 2012-01-02 18:14:18

执行此操作之前，请查看下一个答案。 – IMLiviu 2013-10-05 00:02:45

@IMLiviu以下答案与此问题的需求不符。这是一个多阶段的形式。此外，read more链接表示不使用该代码，而是在答案中提供的第二段代码。 – 2013-10-05 15:35:48

答

在帖子中的方法试试这个回调函数

$(':input','#myform') 
.not(':button, :submit, :reset, :hidden') 
.val('') 
.removeAttr('checked') 
.removeAttr('selected');

更多信息读取this

答

显然这会为你做。

$('input').val('').removeAttr('checked').removeAttr('selected');

答

您可以重置您的形式：

$("#myform")[0].reset();

[0]的用法是什么？ – Rahul 2015-10-28 11:33:08

使用[0]会返回原生html元素而不是DOM。 – 2015-11-01 05:39:48

答

只需将它添加到在一些DIV或TD的操作文件，所以它带有传入的XML对象

<script type="text/javascript"> 
    $("#formname").resetForm(); 
    </script>

在哪里“formname”是你要编辑的表单的编号

答

用jQuery重置表单的更好方法是简单trigger a reset事件在您的窗体上。

$("#btn1").click(function() { 
     $("form").trigger("reset"); 
    });

一些细节来解释你在这里做什么，将不胜感激。 – skypjack 2016-02-22 20:17:55

使用jQuery提交后清除表格

相关推荐