jquery序列化表單以及回調(diào)函數(shù)的使用示例

更新時(shí)間：2014年07月02日 15:50:58 投稿：whsnow

使用jQuery提供的表單序列化方法可以很好的解決JSP表單中一個(gè)個(gè)傳值的問(wèn)題，下面有個(gè)示例，大家可以參考下

在開(kāi)發(fā)項(xiàng)目中，將前臺(tái)的值傳給后臺(tái)，有時(shí)的JSP表單中的值有一兩個(gè)，也有全部的值，如果這時(shí)一個(gè)個(gè)傳，必定不是很好的辦法，所以使用jQuery提供的表單序列化方法，可以很好的解決這個(gè)問(wèn)題，同時(shí)可以封裝成通用的函數(shù)，執(zhí)行成功可以調(diào)用各自的回調(diào)函數(shù)，實(shí)現(xiàn)各自的功能。

代碼如下：

function queryUserInfo(actionUrl,formId,fun){ 
var params=new Object(); //聲明數(shù)組 
$.each($("#"+formId).serializeArray(),function(index,param){ 
params[param.name] = param.value; //序列化表單 
}); 
params['time']=new Date(); //1 
$.ajax( { 
url : basePath+actionUrl, 
data : params,//沒(méi)有1，可以這樣寫("#"+formId).serializeArray() 
type : 'POST', 
dataType:'json', 
async: false,//表示同步，等待服務(wù)端返回?cái)?shù)據(jù)，才會(huì)執(zhí)行后面的代碼 
success : function(obj) { 
fun(actionUrl,formId,obj); 
}, 
error: function() { 
alert("訪問(wèn)異常"); 
} 
}); 
}

另一種方式：

function setUserInfo(actionUrl,userid,username,fun){ 
var params=new Object(); //聲明數(shù)組 
params['user.id']=userid; 
params['user.name']=username; 
$.ajax( { 
url : actionUrl, 
data : params,//沒(méi)有1，可以這樣寫("#"+formId).serializeArray() 
type : 'POST', 
dataType:'json', 
async: false,//表示同步，等待服務(wù)端返回?cái)?shù)據(jù)，才會(huì)執(zhí)行后面的代碼 
success : function(obj) { 
fun(actionUrl,formId,obj);//調(diào)用回調(diào)的函數(shù) 
}, 
error: function() { 
alert("訪問(wèn)異常"); 
} 
}); 
}

您可能感興趣的文章:

相關(guān)文章

模擬多級(jí)復(fù)選框效果的jquery代碼
今天又次體會(huì)到j(luò)query的強(qiáng)大了，做了個(gè)多級(jí)復(fù)選框的效果，代碼塊分兩塊:一是全選的效果、二是當(dāng)前復(fù)選框的父框根據(jù)當(dāng)前框的兄弟是否全選中來(lái)決定父框是否選中
2013-08-08
jquery miniui 教程表格控件合并單元格應(yīng)用
本文將詳細(xì)介紹jquery miniui 教程表格控件合并單元格的應(yīng)用，需要的朋友可以參考下
2012-11-11
jquery實(shí)現(xiàn)手風(fēng)琴案例
這篇文章主要為大家詳細(xì)介紹了jquery實(shí)現(xiàn)手風(fēng)琴案例，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2020-05-05
簡(jiǎn)單實(shí)現(xiàn)jquery隔行變色
這篇文章主要為大家詳細(xì)介紹了實(shí)現(xiàn)jquery隔行變色效果，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2017-11-11
jQuery插件制作之全局函數(shù)用法實(shí)例
這篇文章主要介紹了jQuery插件制作之全局函數(shù)用法,實(shí)例分析了jQuery中全局函數(shù)的相關(guān)使用技巧,需要的朋友可以參考下
2015-06-06
jquery js 重置表單 reset()具體實(shí)現(xiàn)代碼
我們希望表單提交以后，能reset，由于jquery沒(méi)有這個(gè)方法，所以只能采用其他的方法來(lái)實(shí)現(xiàn)了，具體如下，有此需求的朋友可以參考下，希望對(duì)大家有所幫助
2013-08-08
vue-preview縮略圖報(bào)錯(cuò)解決
這篇文章主要為大家介紹了vue-preview縮略圖報(bào)錯(cuò)解決,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪
2023-08-08
對(duì) jQuery 中 data 方法的誤解分析
一直以來(lái)都認(rèn)為新版本中 data 是調(diào)用 dataset 實(shí)現(xiàn)的，對(duì)于低版本IE則采用 getAttribute其實(shí)一直是我誤解了，也不知道最初這個(gè)想法是怎么來(lái)的
2014-06-06
一個(gè)用jquery寫的判斷div滾動(dòng)條到底部的方法【推薦】
下面小編就為大家?guī)?lái)一篇一個(gè)用jquery寫的判斷div滾動(dòng)條到底部的方法【推薦】。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考，一起跟隨小編過(guò)來(lái)看看吧
2016-04-04
AJAX和jQuery動(dòng)態(tài)加載數(shù)據(jù)的實(shí)現(xiàn)方法
本文給大家介紹使用ajax和jquery動(dòng)態(tài)加載數(shù)據(jù)的實(shí)現(xiàn)方法，使用jQuery可以簡(jiǎn)化這個(gè)過(guò)程。下面通過(guò)實(shí)例代碼給大家介紹下，需要的的朋友參考下吧
2016-12-12