form表单提交的几种方法

时间:2021-02-06 17:40:50

form表单提交的几种方法

  1. <form id="myform" name="myform" method="post" onsubmit="return sumbitTest();"
  2. action="RegisterAction.action">
  3. <table>
  4. <tr>
  5. <td>姓名:</td>
  6. <td> <input type="text" name="name" /> </td>
  7. </tr>
  8. <tr>
  9. <td>性别:</td>
  10. <td>
  11. <input type="radio" name="sex" value="1"> 男
  12. <input type="radio" name="sex" value="0"> 女
  13. </td>
  14. </tr>
  15. <tr>
  16. <td>年龄:</td>
  17. <td>
  18. <select name="age">
  19. <option value="20">20</option>
  20. <option value="21">21</option>
  21. <option value="22">22</option>
  22. </select>
  23. </td>
  24. </tr>
  25. <tr>
  26. <td colspan="2">
  27. <input type="submit" value="Submit普通提交">
  28. <input type="button" id="ajaxBtn" value="AJAX提交" />
  29. <input type="button" id="jqueryBtn" value="jQuery提交" />
  30. <input type="button" id="jsBtn" value="JS提交" />
  31. <input type="submit" value="onSubmit提交" />
  32. </td>
  33. </tr>
  34. </table>
  35. </form>
  1. <script type="text/javascript">
  2. $(function() {
  3. //ajax提交
  4. $("#ajaxBtn").click(function() {
  5. var params = $("#myform").serialize();
  6. $.ajax( {
  7. type : "POST",
  8. url : "RegisterAction.action",
  9. data : params,
  10. success : function(msg) {
  11. alert("success: " + msg);
  12. }
  13. });
  14. })
  15. //jQuery提交
  16. $("#jqueryBtn").click(function(){
  17. $("#myform").submit();
  18. })
  19. //js提交
  20. $("#jsBtn").click(function(){
  21. document.myform.action="RegisterAction.action";
  22. document.myform.submit();
  23. })
  24. })
  25. function sumbitTest(){
  26. return true; //return false则不会提交
  27. }
  28. </script>

以上是比较常用的几种表单提交方式,但绝不局限于这些

form表单提交的几种方法