本文实例讲述了框架实现形式表单序列化转换为数据对象功能。分享给大家供大家参考，具体如下：

做网前端开发时，需要创建交互式、快速动态网页应用的网页开发技术提交大量表单数据，如果一个个形式字段拼接很费劲也容易出错，下面方法可解决这个问题

！DOCTYPE html html head meta charset=' utf-8 '/title jquery表单序列化转换为数据对象/title脚本src=' http://cdn。bootscs。com/jquery/3。0 .0/jquery。量滴js '/script/script/head body form action=' name=' post _ form ' id=' post _ form '姓名：输入类型='name' name='name' value='王br/性别：输入类型='收音机'名称='性'值='男检查男输入类型='收音机'名称='性'值='女'女br/爱好：输入类型='复选框'名称='爱'值='篮球' 篮球输入类型='复选框'名称='爱'值='足球'足球br/籍贯：选择名称='省'选项值='上海'上海/option选项值='北京'北京/option选项值='深圳'深圳/option/select/form div id=' result ' style=' margin-top :20 px；宽度宽度：600像素高度：100 pxborder:1px实心# f00'/div div按钮id=“发送”发送/button /div脚本//jquery表单序列化转换为数据对象(函数($){ $。fn。serialize JSON=function(){ var serialieobj={ }；定义变量数组=这个。SerializeArray()；var str=this。serialize()；$(数组)。每个（函数(){ if(SerialieObj[this。名称]){ if($).isArray(Serializeobj[this。name]){ Serialieobj[this。姓名].推(这个。值)；} else { serializeObj[this。name]=[SerialieObj[this。姓名]，这个。值]；} } else { serializeObj[this。名称]=这个。价值；} });返回serializeObj }；})(jQuery)；$(文档)。ready(function(){ $('#send ')).单击(function(){ var post _ data=$(' # post _ form ').serializeJson()；//表单序列化$(“# result”).html(JSON。stringify(post _ data))；})})/脚本/正文/html运行效果如下图所示：

PS:关于数据操作，这里再为大家推荐几款比较实用的数据在线工具供大家参考使用：

在线数据代码检验、检验、美化、格式化工具：http://tools.jb51.net/code/json

数据在线格式化工具：http://工具。JB 51。net/code/jsonformat

在线XML/JSON互相转换工具：http://工具。JB 51。net/code/xmljson

数据代码在线格式化/美化/压缩/编辑/转换工具：http://工具。JB 51。net/code/jsoncodeformat

在线数据压缩/转义工具：http://工具。JB 51。net/code/JSON _ Yasuo _ trans

更多关于框架相关内容感兴趣的读者可查看本站专题： 《jQuery form操作技巧汇总》 、 《jQuery操作json数据技巧汇总》 、 《jQuery常用插件及用法总结》 、 《jQuery扩展技巧总结》 、 《jQuery表格(table)操作技巧汇总》 及《jquery选择器用法总结》

希望本文所述对大家框架程序设计有所帮助。