1. 程式人生 > >jquery form表單序列化

jquery form表單序列化

sele 序列 內容 var ria proc 個數 ali checkbox

一、serialize()

作用

serialize() 方法通過序列化表單值,創建 URL 編碼文本字符串。

語法

$(selector).serialize();

比如

$("button").click(function(){
  $("div").text($("form").serialize());
});

二、註意點

不能序列化file文件類型的input,只適用於一些常用的類型例如text、checkbox、select、date等。

三、FormData 對象

FormData的封裝方式,可以將form表單中的內容封裝成formdata的數據格式 ,file文件類型的數據同樣可以封裝。

var formdata = new FormData($(‘#form‘)[0]);

需要註意的是FormData是JavaScript對象,而$是jQuery對象。所以需要進行轉化。

jQuery對象轉成DOM對象:

1、jQuery對象是一個數據對象,可以通過[index]方法獲得相應的DOM對象。

var $form=$(‘#form‘); //得到jQuery對象

var form=$("form")[0]; //轉換成DOM對象

2、jQuery也可以通過.get(index)方法得到相應的DOM對象

var $form=$(‘#form‘); //得到jQuery對象

var form=$form.get(0); //得到DOM對象

DOM對象轉成jQuery對象:

只需要用$()將DOM對象包裝起來,就能獲得jQuery對象了

var form=document.getElementById("form"); //得到DOM對象

var $v=$(form); //轉成jQuery對象

四、參數

$.ajax的contentType默認數據格式是name=value,每組之間用 & 聯接。

processData是Boolean類型的參數,默認為true。和contentType配合使用。

但是form表單用FormData封裝之後就不在是contentType的默認數據格式了,所以要設置參數contentType: flase, processData: false.

也有說以formdata的方式提交時需要添加async: false, 同步,否則後臺無法接收到前臺傳過來的file文件數據。不過我在實際項目中沒有添加async: false也完全正確,沒有任何報錯。

(over)

jquery form表單序列化