jquery序列化form表单
在开发中有时需要在js中提交form表单数据,就需要将form表单进行序列化。
jquery提供的serialize方法能够实现。
$("#searchForm").serialize();
但是,观察输出的信息,发现serialize()方法做的是将表单中的数据以htpp请求格式拼接成字符串。
例如以下代码:
<form id="searchForm">
<input name="id" value="123"/>
<input name="cx" value="lklj"/>
</form>
<script type="text/javascript">
console.info($("#searchForm").serialize());
</script>
输出结果是:id=123&cx=lklj
serialize确实是能够解决一般的提交数据。但是有时我们需要的是一个object对象,而不是字符串(比如jqgrid reload时设置查询条件参数,就需要object对象)。
所以就需要提供一个能将form转化为对象的方法。参考自:http://www.cnblogs.com/yeminglong/p/3799282.html
(function(window, $) {
$.fn.serializeJson = function() {
var serializeObj = {};
var array = this.serializeArray();
var str = this.serialize();
$(array).each(
function() {
if (serializeObj[this.name]) {
if ($.isArray(serializeObj[this.name])) {
serializeObj[this.name].push(this.value);
} else {
serializeObj[this.name] = [
serializeObj[this.name], this.value ];
}
} else {
serializeObj[this.name] = this.value;
}
});
return serializeObj;
};
})(window, jQuery);
调用插件:
console.info($("#searchForm").serializeJson());
输出结果:Object {id: "123", cx: "lklj"}
文章可能没有多深或多新颖的知识点,但都是自己亲手实践,记录自己感受与收获。
jquery序列化form表单的更多相关文章
- jquery序列化form表单使用ajax提交后处理返回的json数据
1.返回json字符串: /** 将一个字符串输出到浏览器 */ protected void writeJson(String json) { PrintWriter pw = null; try ...
- jquery 序列化form表单
1.为什么要将form表单序列化? ajax上传form表单的原始方式,是将form表单中所需要的键值对先获取,然后再组装成数据(两种方式:http:localhost:8080/test.do?pe ...
- jquery序列化from表单使用ajax提交返回json数据(使用struts2注解result type = json)
1.action类引入struts2的"json-default"拦截器栈 @ParentPackage("json-default") //示例 @Paren ...
- 【jQuery】form表单元素序列化为json对象
序列化form表单元素为json对象: <!Doctype html> <html xmlns=http://www.w3.org/1999/xhtml> <head&g ...
- select标签 禁止选择但又能通过序列化form表单传值到后台
前言 项目开发中,我们可能会碰到这样的需求:select标签,禁止选择但又能通过序列化form表单传值到后台,但是当我们使用disabled="disabled"时发现,无法序列化 ...
- 基于Bootstrap+jQuery.validate Form表单验证实践
基于Bootstrap jQuery.validate Form表单验证实践 项目结构 : github 上源码地址:https://github.com/starzou/front-end- ...
- thinkphp处理jQuery EasyUI form表单问题
jQuery EasyUI form表单不是ajax方式提交,而是在提交的时候新建一个隐藏的iframe并在iframe里面创建一个与绑定表单一样的表单,然后在iframe里面进行同步提交而不是异步提 ...
- jQuery控制form表单元素聚焦
CreateTime--2017年5月28日08:57:16Author:Marydon jQuery使form表单的第一个文本框聚焦 /** * 使form表单的第一个文本框聚焦 */ func ...
- jQuery实现form表单基于ajax无刷新提交方法详解
本文实例讲述了jQuery实现form表单基于ajax无刷新提交方法.分享给大家供大家参考,具体如下: 首先,新建Login.html页面: <!DOCTYPE html PUBLIC &quo ...
随机推荐
- .Net普通三层 到 工厂模式->线程内唯一+单元工作模式->WebService分布式三层
在软件世界分层的思想无处不在 主要是为了提高软件系统的维护性,扩展性,复用性和解耦等 软件的三层构架是一种最基本的分层思想的体现 结构图大体如下: 如此一来,开发人员可以只关注其中一层,而无需关心下一 ...
- 安装pybloomfiltermmap 遇到bug
pybloomfiltermmap pip 安装 : sudo pip install pybloomfiltermmap I want to try one program which have m ...
- eclipse hibernate plugin
JBoss Tools hibernate tools for eclipse plugins
- UVa 507 - Jill Rides Again
题目大意:最大和子序列问题.由于具有最大和的子序列具有一下性质:第一项不为负数,并且从第一项开始累加,中间不会有和出现负数,因为一旦有负数我们可以抛弃前边的部分以得到更大的子序列和,这将会产生矛盾. ...
- 解開32位元Win 7記憶體4GB限制
解開32位元Win 7記憶體4GB限制: ReadyFor4GB 檔案下載:ReadyFor4GB https://sites.google.com/a/joytown.tw/bai-jia-zhi/ ...
- Javascript 浮点运算问题分析与解决
分析 JavaScript 只有一种数字类型 Number ,而且在Javascript中所有的数字都是以IEEE-754标准格式表示的. 浮点数的精度问题不是JavaScript特有的,因为有些小数 ...
- UITextField 之 失去焦点 收起键盘
1. 代理 UITextFieldDelegate 2. 设置代理 textfield.delegate = self; 3. 代理事件处理 #pragma mark - textfiled代理 -( ...
- ubuntu 设置主屏和副屏
作为一个程序员,从开始使用双屏之后,一个显示屏开发,那种感觉,就是不好... 好吧,刚换到ubuntu,笔记本一个显示屏,外接了一个HDMI的显示器,由于书桌的位置,只有把HDMI的显示屏放在笔记本的 ...
- iOS 之 WebView 简单使用
1. 代理 UIWebViewDelegate 2. 创建 UIWebView myWebView=[[UIWebView alloc] initWithFrame:CGRectMake(, ,sel ...
- SPI在linux3.14.78 FS_S5PC100(Cortex A8)和S3C2440上驱动移植(deep dive)
由于工作的原因,对SPI的理解最为深刻,也和SPI最有感情了,之前工作都是基于OSEK操作系统上进行实现,也在US/OS3上实现过SPI驱动的实现和测试,但是都是基于基本的寄存器操作,没有一个系统软件 ...