jQuery序列化后的表单值转换成Json


Posted in jQuery onJune 16, 2017

小朋友有一个表单,他想以Json的方式获取到表单的内容。小朋友尝试了以下方式。

通过$("#form").serialize()可以获取到序列化的表单值字符串。

例如:

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

通过$("#form").serializeArray()输出以数组形式序列化表单值。

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

统统不满足小朋友想得到Json的愿望。堆栈溢出后,找到了一个这样的方法

$.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内容噜。

以上所述是小编给大家介绍的jQuery序列化后的表单值转换成Json,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

jQuery 相关文章推荐
jquery实现图片平滑滚动详解
Mar 22 jQuery
BootStrap中jQuery插件Carousel实现轮播广告效果
Mar 27 jQuery
详解如何在 vue 项目里正确地引用 jquery 和 jquery-ui的插件
Jun 01 jQuery
jquery请求servlet实现ajax异步请求的示例
Jun 03 jQuery
jquery实现限制textarea输入字数的方法
Sep 06 jQuery
jQuery响应滚动条事件功能示例
Oct 14 jQuery
jQuery中的类名选择器(.class)用法简单示例
May 14 jQuery
基于jQuery实现的设置文本区域的光标位置
Jun 15 jQuery
jquery实现的简单轮播图功能【适合新手】
Aug 17 jQuery
jQuery实现模拟搜索引擎的智能提示功能简单示例
Jan 27 jQuery
详解如何使用webpack打包多页jquery项目
Feb 01 jQuery
jQuery+PHP+Ajax实现动态数字统计展示功能
Dec 25 jQuery
基于jQuery和CSS3实现APPLE TV海报视差效果
Jun 16 #jQuery
利用jquery去掉时光轴头尾部线条的方法实例
Jun 16 #jQuery
jQuery实现 RadioButton做必选校验功能
Jun 15 #jQuery
jQuery ajax动态生成table功能示例
Jun 14 #jQuery
jQuery.form.js的使用详解
Jun 14 #jQuery
jQueryeasyui 中如何使用datetimebox 取两个日期间相隔的天数
Jun 13 #jQuery
jquery+css实现侧边导航栏效果
Jun 12 #jQuery
You might like
php垃圾代码优化操作代码
2010/08/05 PHP
解析:通过php socket并借助telnet实现简单的聊天程序
2013/06/18 PHP
PHP通过反射动态加载第三方类和获得类源码的实例
2015/11/27 PHP
php微信开发之带参数二维码的使用
2016/08/03 PHP
laravel 获取某个查询的查询SQL语句方法
2019/10/12 PHP
解决thinkphp5未定义变量会抛出异常,页面错误,请稍后再试的问题
2019/10/16 PHP
jQuery操作 input type=checkbox的实现代码
2012/06/14 Javascript
无缝滚动js代码通俗易懂(自写)
2013/06/19 Javascript
JS随机漂浮广告代码具体实例
2013/11/19 Javascript
javascript 通用loading动画效果实例代码
2014/01/14 Javascript
PHP+jQuery+Ajax实现多图片上传效果
2015/03/14 Javascript
JS+DIV实现鼠标划过切换层效果的方法
2015/05/25 Javascript
js仿3366小游戏选字游戏
2016/04/14 Javascript
浅谈javascript中new操作符的原理
2016/06/07 Javascript
nodejs实现发出蜂鸣声音(系统报警声)的方法
2017/01/18 NodeJs
JS库之Three.js 简易入门教程(详解之一)
2017/09/13 Javascript
如何从0开始用node写一个自己的命令行程序
2018/12/29 Javascript
如何基于vue-cli3.0构建功能完善的移动端架子
2019/04/24 Javascript
在微信小程序中使用图表的方法示例
2019/04/25 Javascript
微信小程序实现弹框效果
2020/05/26 Javascript
在Python中操作字符串之rstrip()方法的使用
2015/05/19 Python
Python装饰器实现几类验证功能做法实例
2017/05/18 Python
Python实现简单的HttpServer服务器示例
2017/09/25 Python
Python实现字符串匹配的KMP算法
2019/04/04 Python
python如何以表格形式打印输出的方法示例
2019/06/21 Python
python删除列表元素的三种方法(remove,pop,del)
2019/07/22 Python
python读取tif图片时保留其16bit的编码格式实例
2020/01/13 Python
Python with语句用法原理详解
2020/07/03 Python
Python实现打包成库供别的模块调用
2020/07/13 Python
Python如何绘制日历图和热力图
2020/08/07 Python
HTML5的新特性(1)
2016/03/03 HTML / CSS
EJB包括(SessionBean,EntityBean)说出他们的生命周期,及如何管理事务的?
2013/02/17 面试题
我们的节日元宵活动方案
2014/08/23 职场文书
汉字听写大会观后感
2015/06/12 职场文书
写给同事的离职感言
2015/08/04 职场文书
2016年父亲节寄语
2015/12/04 职场文书