Jquery取form表单中的所有参数

转载自：https://blog.csdn.net/qq_15204179/article/details/82144522

表单： 

1.  
   <form class="" id="handle-form">
2.  
   <input type="text" name="id" id="id" value="">
3.  
   <input type="text" id="operator" name="operator" >
4.  
   </form>

第一种获取form中数据的方法：

new FormData（$('#uploadForm')[0]）用法与$("#handle-form").serialize()差不多，就是 可以上传文件但是对于jquery的要求是， 版本1.8及其以上方可支持；

注意：按钮type非submit，而是buttern,Action 为空或无；

var handle-form = $("#handle-form").serialize();

1.  
   $.ajax({
2.  
   url: "",
3.  
   type: "post",
4.  
   contentType: "application/json; charset=utf-8",
5.  
   data: $("#handle-form").serialize();,
6.  
   dataType: "json",
7.  
   success: function (data) {
8.  
    
9.  
   }

第二种获取form中数据的方法：

注意：按钮type非submit，而是buttern,Action 为空或无；

1.  
   var formSerial = {};
2.  
   $($("#handle-form").serializeArray()).each(function(){
3.  
   formSerial[this.name] = this.value;
4.  
   });
5.  
    
6.  
   var fromValue = JSON.stringify(formSerial)

1.  
   $.ajax({
2.  
   url: "",
3.  
   type: "post",
4.  
   contentType: "application/json; charset=utf-8",
5.  
   data: JSON.stringify(formSerial),
6.  
   dataType: "json",
7.  
   success: function (data) {
8.  
    
9.  
   }

form表单提交的几种方法：

 一.表单提交

1.  
   <form action=’/login’ method=’post’ id = "loginForm">
2.  
    
3.  
   <input type=’text’ name=’username’ />
4.  
    
5.  
   <input type=’password’ name=’password’/>
6.  
    
7.  
   <input type=’submit’ value=’登陆'/>
8.  
    
9.  
   </form>

 二.Ajax提交form表单

1.  
   $('#loginForm').submitForm({
2.  
   url: "/login",
3.  
   dataType: "text",
4.  
   callback: function (data) {
5.  
    
6.  
   }
7.  
   },
8.  
   before: function () {
9.  
    
10.  
    }
11.  
    }).submit();

三.form表单提交附件

需要设定form的enctype="multipart/form-data"并且添加<input type=’file’>

1.  
   //jQuery提交
2.  
   $("#jqueryBtn").click(function(){
3.  
   $("#loginForm").submit();
4.  
   })

1.  
   //js提交
2.  
   $("#jsBtn").click(function(){
3.  
   document.loginForm.action="RegisterAction.action";
4.  
   document.loginForm.submit();
5.  
    
6.  
   })
7.  
    
8.  
   //js提交
9.  
   $("#jsBtn").click(function(){
10.  
    document.getElementById('').submit();
11.  
    })
12.  
     

1.  
   //ajax提交
2.  
   $("#ajaxBtn").click(function() {
3.  
   var params = $("#loginForm").serialize();
4.  
   $.ajax( {
5.  
   type : "POST",
6.  
   url : "RegisterAction.action",
7.  
   data : params,
8.  
   success : function(msg) {
9.  
   alert("success: " + msg);
10.  
    }
11.  
    });
12.  
    })