form表单有一个serialize()方法,可以序列化表单的值,但是jquery提供的这个方法会把数据序列化为类似下面的形式:

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

jquery并没有提供将表单数据序列化为json的方法,所以需要我们自己封装一下,下面给出代码和测试样例,先写一个js文件:

$.ajaxSetup({
contentType: "application/x-www-form-urlencoded; charset=utf-8"
});
var DataDeal = {
//将从form中通过$('#form').serialize()获取的值转成json
formToJson: function (data) {
data=data.replace(/&/g,"\",\"");
data=data.replace(/=/g,"\":\"");
data="{\""+data+"\"}";
return data;
},
};

使用方法:先在页面导入上面的js文件,然后

        var data=$('#addf').serialize();//获取值
data= decodeURIComponent(data,true);//防止中文乱码
var json=DataDeal.formToJson(data);//转化为json

玩转web之json(五)---将表单通过serialize()方法获取的值转成json的更多相关文章

  1. 表单提交.serialize()方法

    html中<form id="myForm" action="..." method='POST'> <div><input ty ...

  2. 开发日志系列:一个表单页面的呈现与提交(一)——JSON的操作

    JSON操作 引子 最近在做一个表单页面,大概是这个样子的 这里打算用一个JSON存储所有的信息,我们可以理解为,所有东西都存在一个字符串里面.方便,快捷,易读,数据库操作也方便了.甚至,可以将很多不 ...

  3. Flowable实战(五)表单和流程变量

    一.流程变量   流程实例按步骤执行时,需要保存并使用一些数据,在Flowable中,这些数据称为变量(variable).   流程实例可以持有变量,称作流程变量(process variables ...

  4. Django学习笔记(五)—— 表单

    疯狂的暑假学习之  Django学习笔记(五)-- 表单 參考:<The Django Book> 第7章 1. HttpRequest对象的信息 request.path         ...

  5. javascript将form表单中的元素值封装成json格式

    把form表单中的元素值封装成json function toJSON(form)//form是要进行封装的form表单对象,dom对象,可以通过document.mainForm获得,mainFor ...

  6. Bootstrap入门(五)表单

    Bootstrap入门(五)表单   先引入本地的CSS文件  <link href="css/bootstrap.min.css" rel="stylesheet ...

  7. json数据渲染表单元素出现的问题

    解析页面表单元素 parseForm: function () { var data = {}; $(this).find('input').each(function () { switch ($( ...

  8. SpringBoot(五)_表单验证

    SpringBoot(五)_表单验证 参数校验在我们日常开发中非常常见,最基本的校验有判断属性是否为空.长度是否符合要求等,在传统的开发模式中需要写一堆的 if else 来处理这些逻辑,很繁琐,效率 ...

  9. Bootsrap表格表单及其使用方法

    bootstrap的使用 bootstrap中的js插件依赖于jQuery 因此jQuery要在bootstrap之前引入 参考官网标准引入方法和引入样式 排版 标题 Bootstrap和普通的HTM ...

随机推荐

  1. SQL视图索引

    视图: 视图就相当于一个查询结果,它相对应的是表 表----真正存储数据的地方 视图---不存储数据,展示查询的结果 注意: 1.视图就是为了查询数据方便.一般不要试图向视图中插入数据,容易出错. 2 ...

  2. 深刻:截获windows的消息并分析实例(DefWindowProc),以WM_NCHITTEST举例(Windows下每一个鼠标消息都是由 WM_NCHITTEST 消息产生的,这个消息的参数包含了鼠标位置的信息)

    1,回调函数工作机制 回调函数由操作系统自动调用,回调函数的返回值当然也是返回给操作系统了. 2,截获操作系统发出的消息,截获到后,将另外一个消息返回给操作系统,已达到欺骗操作系统的目的. 下面还是以 ...

  3. 浅析点对点(End-to-End)的场景文字识别(图片文字)

    一.背景 随着智能手机的广泛普及和移动互联网的迅速发展,通过手机等移动终端的摄像头获取.检索和分享资讯已经逐步成为一种生活方式.基于摄像头的 (Camera-based)的应用更加强调对拍摄场景的理解 ...

  4. java学习笔记01--数据类型

    java学习笔记01--数据类型 java数据类型划分 分为两大类型: 1)基本数据类型:类似于普通的值. 2)引用数据类型:传递的是内存的地址. 浮点类型实际上就是表示小数. java基本数据类型 ...

  5. blend

    看着各位大虾出系列文章貌似挺好玩的,本人耍了2个月的Wpf,有点见解,希望各位看官笑纳.本系列第一章就先来点简单又有用的吧o(∩_∩)o 哈哈.. 终于效果例如以下: ←点它 本人一直在做WPF算是第 ...

  6. 墙体裂缝推荐的情况下驱动的PhoneGap入门,早看早收据

    清华大学出版社推出<构建跨平台APP:PhoneGap移动应用实战> 零门槛的学习APP发展 刮 进步 20以上示范样本APP 3项目APP 台à跨终端à移动开发 完美生命周期:搭建好开发 ...

  7. 通用型CRM还是行业型CRM?-定制为王

    大数据时代,怎样利用工具摆脱繁杂的数据管理之苦,洞察有价值的销售信息,是每一个管理者的迫切须要.Zoho  CRM问世10年来,见证了一个个行业客户怎样在CRM帮助下实现了效率和业绩提升.相同,广泛的 ...

  8. Codeforces Round #254 (Div. 1)-A,B

    A:选取两点一边就能够了,非常明显能够想出来... 可是一開始看错题了,sad.... #include<stdio.h> #include<string.h> #includ ...

  9. Codeforces 549G. Happy Line 馋

    非常有趣的贪婪: Let's reformulate the condition in terms of a certain height the towers, which will be on t ...

  10. 新 Netflix 开源门户

    Netflix 开源改革计划:新 Netflix 开源门户 http://www.oschina.net/news/67555/evolution-of-open-source-at-netflix ...