jquery序列化表单以及回调函数的使用示例


Posted in Javascript onJuly 02, 2014

在开发项目中,将前台的值传给后台,有时的JSP表单中的值有一两个,也有全部的值,如果这时一个个传,必定不是很好的办法,所以使用jQuery提供的表单序列化方法,可以很好的解决这个问题,同时可以封装成通用的函数,执行成功可以调用各自的回调函数,实现各自的功能。

代码如下:

function queryUserInfo(actionUrl,formId,fun){ 
var params=new Object(); //声明数组 
$.each($("#"+formId).serializeArray(),function(index,param){ 
params[param.name] = param.value; //序列化表单 
}); 
params['time']=new Date(); //1 
$.ajax( { 
url : basePath+actionUrl, 
data : params,//没有1,可以这样写("#"+formId).serializeArray() 
type : 'POST', 
dataType:'json', 
async: false,//表示同步,等待服务端返回数据,才会执行后面的代码 
success : function(obj) { 
fun(actionUrl,formId,obj); 
}, 
error: function() { 
alert("访问异常"); 
} 
}); 
}

另一种方式:

function setUserInfo(actionUrl,userid,username,fun){ 
var params=new Object(); //声明数组 
params['user.id']=userid; 
params['user.name']=username; 
$.ajax( { 
url : actionUrl, 
data : params,//没有1,可以这样写("#"+formId).serializeArray() 
type : 'POST', 
dataType:'json', 
async: false,//表示同步,等待服务端返回数据,才会执行后面的代码 
success : function(obj) { 
fun(actionUrl,formId,obj);//调用回调的函数 
}, 
error: function() { 
alert("访问异常"); 
} 
}); 
}
Javascript 相关文章推荐
javascript 多级checkbox选择效果
Aug 20 Javascript
百度留言本js 大家可以参考下
Oct 13 Javascript
Javascript 修改String 对象 增加去除空格功能(示例代码)
Nov 30 Javascript
javascript使用for循环批量注册的事件不能正确获取索引值的解决方法
Dec 20 Javascript
jQuery源码分析之jQuery.fn.each与jQuery.each用法
Jan 23 Javascript
JavaScript设置表单上传时文件个数的方法
Aug 11 Javascript
jquery制做精致的倒计时特效
Jun 13 Javascript
学习使用bootstrap的modal和carousel
Dec 09 Javascript
Three.js的使用及绘制基础3D图形详解
Apr 27 Javascript
使用pm2自动化部署node项目的方法步骤
Jan 28 Javascript
关于layui flow loading占位图的实现方法
Sep 21 Javascript
Vue绑定用户接口实现代码示例
Nov 04 Javascript
IE8下Jquery获取select选中的值post到后台报错问题
Jul 02 #Javascript
js面向对象编程之如何实现方法重载
Jul 02 #Javascript
jquery.validate.js插件使用经验记录
Jul 02 #Javascript
escape编码与unescape解码汉字出现乱码的解决方法
Jul 02 #Javascript
js获取IP地址的方法小结
Jul 01 #Javascript
jQuery截取指定长度字符串的实现原理及代码
Jul 01 #Javascript
原生js事件的添加和删除的封装
Jul 01 #Javascript
You might like
php中echo()和print()、require()和include()等易混淆函数的区别
2012/02/22 PHP
探讨:如何编写PHP扩展
2013/06/13 PHP
PHP设计模式之迭代器模式
2016/06/17 PHP
JQuery实现倒计时按钮的实现代码
2012/03/23 Javascript
Extjs NumberField后面加单位实现思路
2013/07/30 Javascript
javascript学习笔记--数字格式类型
2014/05/22 Javascript
jquery插件方式实现table查询功能的简单实例
2016/06/06 Javascript
JavaScript中点击事件的写法
2016/06/28 Javascript
微信小程序 Storage API实例详解
2016/10/02 Javascript
JavaScript 数组的进化与性能分析
2017/09/18 Javascript
vueJs实现DOM加载完之后自动下拉到底部的实例代码
2018/08/31 Javascript
JavaScript如何处理移动端拍摄图片旋转问题
2019/11/16 Javascript
vue实现学生信息管理系统
2020/05/30 Javascript
js实现飞机大战小游戏
2020/08/26 Javascript
微信小程序实现身份证取景框拍摄
2020/09/09 Javascript
在antd4.0中Form使用initialValue操作
2020/11/02 Javascript
vue 图片裁剪上传组件的实现
2020/11/12 Javascript
解决iView Table组件宽度只变大不变小的问题
2020/11/13 Javascript
Bootstrap FileInput实现图片上传功能
2021/01/28 Javascript
Python内置函数Type()函数一个有趣的用法
2015/02/18 Python
Python实现的数据结构与算法之队列详解
2015/04/22 Python
Python3计算三角形的面积代码
2017/12/18 Python
简单实现python进度条脚本
2017/12/18 Python
Python线程创建和终止实例代码
2018/01/20 Python
Python多线程实现支付模拟请求过程解析
2020/04/21 Python
Python+OpenCV图像处理——实现轮廓发现
2020/10/23 Python
css3实现六边形边框的实例代码
2019/05/24 HTML / CSS
Airbnb爱彼迎官网:成为爱彼迎房东,赚取收入
2019/03/14 全球购物
Joseph官网:英国小众奢侈品牌
2019/05/17 全球购物
UNIX文件系统常用命令
2012/05/25 面试题
美发店5.1活动方案
2014/01/24 职场文书
小学生元旦广播稿
2014/02/21 职场文书
2015年元旦晚会活动总结(学生会)
2014/11/28 职场文书
2015年推普周活动总结
2015/03/27 职场文书
太行山上观后感
2015/06/05 职场文书
JS的深浅复制详细
2021/10/16 Javascript