Question

我有简单的html表单

 <form id="formreg" name="formreg" method="post"  enctype="multipart/form-data" style="margin:0; padding:0; float:left;" onsubmit="return CommonFunction(this);">   



  <table border="1" cellpadding="2" cellspacing="1" style="border-collapse:collapse; font:12px Verdana, Arial, Helvetica, sans-serif;">

  <tr>
  <td align="left"> First Name : </td>
  <td> <input type="text" name="firstname" value=""/></td>
  </tr>



  <tr>
  <td align="left"> Last Name : </td>
  <td> <input type="text" name="lname" value=""/></td>
  </tr>

  <tr>
  <td align="left"> Email : </td>
  <td> <input type="text" name="useremail" value=""/></td>
  </tr>


  <tr>
  <td align="left"> Contact No : </td>
  <td> <input type="text" name="usercontact" value=""/></td>
  </tr>

  <tr>
  <td align="left"> Designation : </td>
  <td> <input type="text" name="designation" value="" size="20" /></td>
  </tr>

  <tr>
  <td align="left"> Gender : </td>
  <td> 
  <input type="radio" name="gender" value="Male" /> Male &nbsp;&nbsp;<input type="radio" name="gender" value="Female" /> Female
  </td>
  </tr>

  <tr>
  <td align="left"> Country : </td>
  <td> 

  <select name="country">

     <option value="India">India</option>
     <option value="USA">USA</option>
     <option value="UK">UK</option>
  </select>
  </td>
  </tr>



  <tr>
  <td align="left"> Message/Comment: </td>
  <td> <textarea name="message" cols="20" rows="5"></textarea></td>
  </tr>

  <tr>
  <td align="left" colspan="2"> <input type="submit" name="Sub" value="Insert" /> &nbsp; <input type="reset"  value="Reset" /> </td>
  </tr>

  </table>
  </form>

使用表单字段（输入，文本区域，选择框和单选按钮）。

我需要java脚本函数或jquery代码来清除所有表单字段。我无法使用重置按钮，因为在表单onsubmit事件中我调用了一个名为CommonFunction（）的函数，该函数使用jQuery.ajax发布所有表单字段。问题是当我提交表单数据成功发布但表单字段没有自动清除，因为我使用jQuery.ajax提交表单

提交数据后，我希望表格清晰。

需要帮助

Answer 1

这是一个小提琴，就是这样。你可以扩展这个。但也许使用jQuery.forms会更好。

小提琴重置如下的值。在你的情况下，你想要这样做AJAX帖子的回调成功。

$.ajax({
  type: "POST",
  url: "some.php",
  data: { name: "John", location: "Boston" }
})
  .done(function( msg ) {
     alert( "Data Saved: " + msg );
     // Clear the form
     $('input[type=text], textarea').val('');
     $('select').find('option').prop("selected", false);
     $('input[type=radio]').prop("checked", false);
});

最后，您可以创建一个帮助函数来存储该代码。然后您也可以将其调用为其他表单，并且您的代码将更清晰。

http://jsfiddle.net/TZ6GR/1/

http://malsup.com/jquery/form/

Answer 2

试试这个

 $(function(){
   $("#formreg").find("input,textarea").val('');
 });

Answer 3

在您提交了答案后，您可以运行以下代码：

$("form#formreg").find("input[type=text], textarea").val("");

这将清除表单中的所有文本字段和文本输入。

如何在javascript或jquery中清除表单字段（输入，文本区域，选择和广播）

3 个答案: