首頁 web前端 js教程 基于jQuery的一个扩展form序列化到json对象_jquery

基于jQuery的一个扩展form序列化到json对象_jquery

May 16, 2016 pm 06:14 PM
form 序列化

复制代码 代码如下:

$.fn.serializeObject = function() {
var o = {};
var a = this.serializeArray();
$.each(a, function() {
if (o[this.name]) {
if (!o[this.name].push) {
o[this.name] = [ o[this.name] ];
}
o[this.name].push(this.value || '');
} else {
o[this.name] = this.value || '';
}
});
return o;
}

这个function对于普通的对象转换是足够的,但是如果出现对象内部又包含子对象的情形就不能支持了。
例如我有这样的一个form表单:
复制代码 代码如下:







对应到server端上的domain class是这样的:
复制代码 代码如下:

public class DummyProduct {

private DummyCategory category;
private String name;

public DummyCategory getCategory() {
return category;
}
public void setCategory(DummyCategory category) {
this.category = category;
}
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}

}
public class DummyCategory {
private String id;
private String name;
public String getId() {
return id;
}
public void setId(String id) {
this.id = id;
}
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
}

如果想把表单数据序列化成跟server端domain class匹配的json字符串,就可以使用我下面的这个扩展
复制代码 代码如下:

/** @serializedParams looks like "prop1=value1&prop2=value2".  
Nested property like 'prop.subprop=value' is also supported **/
function paramString2obj (serializedParams) {

var obj={};
function evalThem (str) {
var attributeName = str.split("=")[0];
var attributeValue = str.split("=")[1];
if(!attributeValue){
return ;
}

var array = attributeName.split(".");
for (var i = 1; i var tmpArray = Array();
tmpArray.push("obj");
for (var j = 0; j tmpArray.push(array[j]);
};
var evalString = tmpArray.join(".");
// alert(evalString);
if(!eval(evalString)){
eval(evalString+"={};");
}
};
eval("obj."+attributeName+"='"+attributeValue+"';");

};
var properties = serializedParams.split("&");
for (var i = 0; i evalThem(properties[i]);
};
return obj;
}
$.fn.form2json = function(){
var serializedParams = this.serialize();
var obj = paramString2obj(serializedParams);
return JSON.stringify(obj);
}

使用起来大概像这个样子:
复制代码 代码如下:

var json = $("#testform").form2json();
alert(json);
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱門文章

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

熱門話題

Java教學
1664
14
CakePHP 教程
1423
52
Laravel 教程
1318
25
PHP教程
1268
29
C# 教程
1248
24
PHP資料處理技巧:如何使用serialize與unserialize函數實作資料序列化與反序列化 PHP資料處理技巧:如何使用serialize與unserialize函數實作資料序列化與反序列化 Jul 29, 2023 am 10:49 AM

PHP資料處理技巧:如何使用serialize和unserialize函數實現資料序列化與反序列化序列化和反序列化是電腦科學中常用的資料處理技巧之一。在PHP中,我們可以使用serialize()和unserialize()函數來實現資料的序列化和反序列化操作。本文將為您詳細介紹如何使用這兩個函數,並提供相關程式碼範例。一、什麼是序列化和反序列化在電腦編

在Java中,我們如何使用flexjson序列化物件清單? 在Java中,我們如何使用flexjson序列化物件清單? Sep 05, 2023 pm 11:09 PM

Flexjson是一個輕量級函式庫,用於序列化和反序列化Java物件>和來自JSON格式。我們可以使用JSONSerializer類別的serialize()方法序列化物件清單。此方法可以對目標實例執行淺層序列化。我們需要將清單類型的物件清單作為參數傳遞給serialize()方法。語法publicStringserialize(Objecttarget)範例importflexjson.JSONSerializer;importjava.util.*;publicclassJsonSerial

C++ 函式庫如何進行序列化與反序列化? C++ 函式庫如何進行序列化與反序列化? Apr 18, 2024 am 10:06 AM

C++函式庫序列化和反序列化指南序列化:建立輸出流並將其轉換為存檔格式。將物件序列化到存檔中。反序列化:建立輸入流並將其從存檔格式還原。從存檔中反序列化物件。實戰範例:序列化:建立輸出流。建立存檔物件。建立物件並將其序列化到存檔中。反序列化:建立輸入流。建立存檔物件。建立物件並從存檔中反序列化。

Java序列化如何影響效能? Java序列化如何影響效能? Apr 16, 2024 pm 06:36 PM

序列化对Java性能的影响:序列化过程依赖于反射,会显著影响性能。序列化需要创建字节流存储对象数据,导致内存分配和处理成本。序列化大对象会消耗大量内存和时间。序列化后的对象在网络上传输时会增加负载量。

如何使用Java中的Jackson函式庫對屬性的順序進行序列化? 如何使用Java中的Jackson函式庫對屬性的順序進行序列化? Aug 28, 2023 pm 12:45 PM

@JsonPropertyOrder是在類別層級使用的註解。它採用字段列表作為屬性,該列表定義字段在物件JSON序列化生成的字串中出現的順序。可以先序列化註釋聲明中包含的屬性(按定義的順序),然後序列化定義中未包含的任何屬性。語法public@interfaceJsonPropertyOrder範例importcom.fasterxml.jackson.core.*;importcom.fasterxml.jackson.databind.*;importcom.fasterxml.jac

Java 中介面和抽象類別的序列化和反序列化 Java 中介面和抽象類別的序列化和反序列化 May 02, 2024 am 08:33 AM

介面無法直接序列化,抽象類別可以序列化但前提是不包含非靜態、非瞬態欄位或覆寫writeObject()和readObject()方法,具體實例可透過實作介面的具體類別或覆寫writeObject()和readObject ()方法的抽象類別實作。

golang函數類型的序列化與反序列化 golang函數類型的序列化與反序列化 Apr 29, 2024 am 08:15 AM

GoLang函數類型可透過encoding/gob套件實現序列化和反序列化。序列化:註冊自訂類型並使用gob.NewEncoder將函數類型編碼為位元組數組。反序列化:使用gob.NewDecoder從位元組數組反序列化函數類型。

如何使用Java中的flexjson函式庫序列化一個map? 如何使用Java中的flexjson函式庫序列化一個map? Aug 26, 2023 pm 08:13 PM

Flexjson是一個輕量級函式庫,用於將Java物件序列化為JSON格式以及反序列化為JSON格式。我們也可以使用JSONSerializer類別的serialize()方法來序列化Map,它對目標實例執行淺層序列化。語法publicStringserialize(Objecttarget)範例importflexjson.JSONSerializer;importjava.util.*;publicclassJsonSerializeMapTest{  publ

See all articles