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 23 jQuery
jQuery编写textarea输入字数限制代码
Mar 23 jQuery
jQuery extend()详解及简单实例
May 06 jQuery
jquery实现图片轮播器
May 23 jQuery
jquery.validate.js 多个相同name的处理方式
Jul 10 jQuery
jQuery实现腾讯信用界面(自制刻度尺)样式
Aug 15 jQuery
使用jquery的jsonp如何发起跨域请求及其原理详解
Aug 17 jQuery
jQuery UI Draggable + Sortable 结合使用(实例讲解)
Sep 07 jQuery
利用jQuery+localStorage实现一个简易的计时器示例代码
Dec 25 jQuery
jQuery实现侧边栏隐藏与显示的方法详解
Dec 22 jQuery
jQuery实现颜色打字机的完整代码
Mar 19 jQuery
jquery插件实现轮播图效果
Oct 19 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中ADODB类详解
2008/03/25 PHP
使用PHP获取网络文件的实现代码
2010/01/01 PHP
php漏洞之跨网站请求伪造与防止伪造方法
2013/08/15 PHP
PHP循环输出指定目录下的所有文件和文件夹路径例子(简单实用)
2014/05/10 PHP
PHP函数func_num_args用法实例分析
2015/12/07 PHP
php批量删除操作(数据访问)
2017/05/23 PHP
Using the TextRange Object
2006/10/14 Javascript
JavaScript中继承的一些示例方法与属性参考
2010/08/07 Javascript
JS简单实现文件上传实例代码(无需插件)
2013/11/15 Javascript
解析JavaScript中instanceof对于不同的构造器或许都返回true
2013/12/03 Javascript
jQuery学习总结之jQuery事件
2014/06/30 Javascript
JS中的二叉树遍历详解
2016/03/18 Javascript
使用three.js 画渐变的直线
2016/06/05 Javascript
Vuejs第十一篇组件之slot内容分发实例详解
2016/09/09 Javascript
强大的 Angular 表单验证功能详细介绍
2017/05/23 Javascript
详解nodejs实现本地上传图片并预览功能(express4.0+)
2017/06/28 NodeJs
浅析vue深复制
2018/01/29 Javascript
js console.log打印对象时属性缺失的解决方法
2019/05/23 Javascript
webpack 动态批量加载文件的实现方法
2020/03/19 Javascript
webstorm建立vue-cli脚手架的傻瓜式教程
2020/09/22 Javascript
python Django模板的使用方法
2016/01/14 Python
详解python函数传参是传值还是传引用
2018/01/16 Python
python3实现基于用户的协同过滤
2018/05/31 Python
使用pandas模块读取csv文件和excel表格,并用matplotlib画图的方法
2018/06/22 Python
利用Python实现某OA系统的自动定位功能
2020/05/27 Python
手把手教你如何用Pycharm2020.1.1配置远程连接的详细步骤
2020/08/07 Python
Python 通过爬虫实现GitHub网页的模拟登录的示例代码
2020/08/17 Python
用CSS3实现瀑布流布局的示例代码
2017/11/10 HTML / CSS
潘多拉珠宝美国官方网站:Pandora US
2020/06/18 全球购物
建筑人员岗位职责
2013/12/25 职场文书
初中高效课堂实施方案
2014/02/26 职场文书
中学生演讲稿
2014/04/26 职场文书
担保书范文
2015/01/20 职场文书
滴水洞导游词
2015/02/10 职场文书
Nginx Rewrite使用场景及配置方法解析
2021/04/01 Servers
Python实现简单的俄罗斯方块游戏
2021/09/25 Python