快捷導(dǎo)航

jQuery序列化后的表單值轉(zhuǎn)換成Json

更新時(shí)間：2017年06月16日 11:30:06 作者：江湖俠客

這篇文章主要介紹了Jquery序列化后的表單值轉(zhuǎn)換成Json的相關(guān)資料，非常不錯(cuò)，具有參考借鑒價(jià)值,需要的朋友可以參考下

小朋友有一個(gè)表單，他想以Json的方式獲取到表單的內(nèi)容。小朋友嘗試了以下方式。

通過$("#form").serialize()可以獲取到序列化的表單值字符串。

例如：

a=1&b=2&c=3&d=4&e=5

通過$("#form").serializeArray()輸出以數(shù)組形式序列化表單值。

[ 
 {name: 'firstname', value: 'Hello'}, 
 {name: 'lastname', value: 'World'},
 {name: 'alias'}, // 值為空
]

統(tǒng)統(tǒng)不滿足小朋友想得到Json的愿望。堆棧溢出后，找到了一個(gè)這樣的方法

$.fn.serializeObject = function()
{
 var o = {};
 var a = this.serializeArray();
 $.each(a, function() {
 if (o[this.name] !== undefined) {
  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;
};

然后通過 $("#form").serializeObject(); 就可以得到Json內(nèi)容嚕。

以上所述是小編給大家介紹的jQuery序列化后的表單值轉(zhuǎn)換成Json，希望對(duì)大家有所幫助，如果大家有任何疑問請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！

您可能感興趣的文章:

相關(guān)文章

淺談jQuery before和insertBefore的區(qū)別
下面小編就為大家?guī)硪黄獪\談jQuery before和insertBefore的區(qū)別。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
2016-12-12
深入理解bootstrap框架之入門準(zhǔn)備
Bootstrap是最流行的前端開發(fā)框架。本文涉及到bootstrap的特性介紹，本文介紹的非常詳細(xì)，具有參考借鑒價(jià)值，感興趣的朋友一起看看吧
2016-10-10
jquery bind(click)傳參讓列表中每行綁定一個(gè)事件
用jquey bind 點(diǎn)擊事件時(shí)，傳參不注意可能會(huì)導(dǎo)致點(diǎn)擊每一行都是顯示相同內(nèi)容的情況,下面有個(gè)示例，感興趣的朋友可以參考下
2014-08-08
基于jQuery實(shí)現(xiàn)仿百度首頁選項(xiàng)卡切換效果
這篇文章主要介紹了基于jQuery實(shí)現(xiàn)仿百度首頁選項(xiàng)卡切換效果的相關(guān)資料,非常不錯(cuò)具有參考借鑒價(jià)值，需要的朋友可以參考下
2016-05-05
Jquery+WebService 校驗(yàn)賬號(hào)是否已被注冊(cè)的代碼
在Javascirpt代碼中，調(diào)用Jquery的方法$.Ajax(function)實(shí)現(xiàn)Ajax,傳遞賬號(hào)信息給Web服務(wù)，Web服務(wù)再調(diào)用數(shù)據(jù)庫操作類查詢數(shù)據(jù)庫，并返回?cái)?shù)據(jù)給前臺(tái)頁面。
2010-07-07
ASP.NET jQuery 實(shí)例7 通過jQuery來獲取DropDownList的Text/Value屬性值
這節(jié)我們將通過jQuery來獲取DropDownList的Text/Value屬性值,需要的朋友可以參考下
2012-02-02
基于Jquery easyui 選中特定的tab
這篇文章主要介紹了基于Jquery easyui 選中特定的tab的相關(guān)資料,需要的朋友可以參考下
2015-11-11
基于Bootstrap和jQuery構(gòu)建前端分頁工具實(shí)例代碼
本文給大家介紹基于Bootstrap和jQuery構(gòu)建前端分頁工具實(shí)例代碼，包括前端分頁的優(yōu)缺點(diǎn)和解決辦法，對(duì)jquery bootstrap分頁知識(shí)感興趣的朋友一起通過本文學(xué)習(xí)吧
2016-11-11
jQuery Ajax 全局調(diào)用封裝實(shí)例代碼詳解
這篇文章主要介紹了jQuery Ajax 全局調(diào)用封裝實(shí)例代碼詳解的相關(guān)資料,非常不錯(cuò)具有參考借鑒價(jià)值，需要的朋友可以參考下
2016-06-06
使用jQuery處理AJAX請(qǐng)求的基礎(chǔ)學(xué)習(xí)教程
這篇文章主要介紹了使用jQuery處理AJAX請(qǐng)求的基礎(chǔ)學(xué)習(xí)教程,除此之外還引申了鏈?zhǔn)教幚硎录卣{(diào)的寫法,由淺入深非常值得借鑒,需要的朋友可以參考下
2016-05-05