`
LoveLZY
  • 浏览: 57489 次
  • 性别: Icon_minigender_1
博客专栏
Group-logo
从零编写RPC框架
浏览量:0
社区版块
存档分类
最新评论

基于jquery把表单转成成json对象

阅读更多
最近前端框架修改,小伙伴希望能像以前写jsp一样使用 对象.属性作为表单元素的name值
    <form id="test-form"> 
  	<input name="a.b.c" value="abc">
  	<input name="a.b.d" value="abd">
  	<input name="x" value="x">
  	<input name="a.f" value="af">
  	<input name="y" value="0">
  	<input name="y" value="y2">
  	<input name="m[0].c" value="m0c">
 	<input name="m[0].d" value="m0d">
  	<input name="m[1].c" value="m1c">
	<input name="m[1].d" value="m1d"> 
    <input type="button" id="test-btn">
  </form>

我这种懒人第一反应肯定去找度娘,发现度娘居然没有,只好自己造了轮子。
   function form2Json(params){
	 var selector=params.form;
	 var values= $(selector).serializeArray();
	 var obj={};
	 for (var index = 0; index < values.length; ++index)    
    {    
       var temp=obj; //上一级     
       var n=values[index].name;  
       if(n.indexOf(".")>-1){  
           var arr=n.split(".");  
           for(var i=0;i<arr.length-1;i++){     
               if(arr[i].indexOf("[")>-1){  
                   var a=arr[i].substring(0,arr[i].indexOf("["));  
                   temp[a]=temp[a]||[];  
                   var y=arr[i].substring(arr[i].indexOf("[")+1,arr[i].indexOf("]"));  
                   temp[a][y]=temp[a][y]||{};  
                   temp=temp[a][y];  
               }else{  
                   temp[arr[i]]=temp[arr[i]] || {};     
                   temp=temp[arr[i]];  
               }  
           }
           temp[arr[arr.length-1]]=values[index].value;       
       }else{  
           if(obj[n] !==undefined && obj[n]!=null){  
              if( !$.isArray(obj[n])){  
                  var v=obj[n];  
                  obj[n]=[];  
                  obj[n].push(v);  
              }
              
              obj[n].push(values[index].value);  
           }else{   
               obj[n]=values[index].value;  
           }  
       }     
    }   	
	 return obj;
}


该轮子支持复杂对象,支持对象数组,支持简单属性
    $("#test-btn").on("click",function(){
	  var json=form2Json({
		  form:"#test-form"
	  });
	 console.log(json);
	 console.log(JSON.stringify(json));
  });



最终结果如下
{"a":{"b":{"c":"abc","d":"abd"},"f":"af"},"x":"x","y":["0","y2"],"m":[{"c":"m0c","d":"m0d"},{"c":"m1c","d":"m1d"}]}


0
1
分享到:
评论

相关推荐

    Java bean转换为Json Schema

    Java Bean转换为Json Schema是一种常见的数据转换操作,特别是在开发基于RESTful API的Web服务时,因为JSON Schema提供了数据验证和文档化的功能。Java Bean是Java编程中的一个概念,它是一类具有特定规则的POJO...

    Android使用Json与Asp.Net交互(上传/下载数据集)

    Asp.Net服务器端借用Newtonsoft.Json.dll进行直接把对象转换成成Json格式的字符串,或把Json字符串转换成类对象。该dll原本针对JavaScript进行的转换,对其中部分类作出了修改,并重新命名为AndroidConvert类。 注...

    json-lib完整架包

    //复合类型bean转成成json @Test public void testBeadToJSON(){ MyBean bean = new MyBean(); bean.setId("001"); bean.setName("银行卡"); bean.setDate(new Date()); List cardNum = new ArrayList(); ...

    ads如何转成成keilmdk

    在嵌入式开发领域,ADDS(ARM Development Studio)和Keil uVision MDK(Microcontroller Development Kit)是两种常见的开发环境,它们都用于编写、编译和调试基于ARM架构的微控制器程序。本文将详细讲解如何将ADS...

    PDF 离线转换 OFD 工具

    这通常意味着该程序是基于Windows操作系统设计的,并且已经包含了所有必要的转换功能,可以在本地计算机上执行,不需要依赖云端服务。 2. **选择待转换的PDF**: 在程序启动后,用户需要指定要转换的PDF文件。这...

    Unity Json读取存储

    LitJson是Unity中常用的Json解析和序列化库,它能够帮助我们快速地将C#对象转换为Json字符串,反之也可以将Json字符串转换为C#对象。在Unity项目中,将LitJson.dll放入Plugins文件夹,这样Unity引擎会在编译时自动...

    Chrome中JSON.parse的特殊实现

    ECMA 262 Edition5 中提供了原生的JSON支持,其中JSON.parse用来将字符串转成成json,见ECMA 262 Edition5 15.12.2。另见:字符串转换成json的三种方式

    jquery实现自定义树形表格的方法【自定义树形结构table】

    自定义树形表格的核心在于能够动态地创建出带有层次性的表格结构,这通常涉及到表格的动态生成以及对DOM(文档对象模型)的操作。在jQuery中,通过选择器可以非常方便地选中特定的DOM元素并对其进行操作。 首先,...

    实现灰度图、二值图、rgb之间的转化

    转换通常是基于阈值操作,低于阈值的像素设为0,高于或等于阈值的设为255。MATLAB中的`imbinarize`函数可以实现此功能,用户可以自定义阈值或选择自动阈值算法。 3. 灰度图的意义与操作: 灰度值代表了像素的亮度...

    41724260-胡成成1

    本报告主要介绍了胡成成同学基于Python的pyQt5库开发的一款简易图片编辑器(PhotoEdit)。这个项目旨在结合Python图形化界面和图像处理技术,提供基础的图片编辑功能,如滤镜应用、图像调整、尺寸修改和旋转等。 1....

    自己动手把VHD制作成ISO系统.doc

    "自己动手把VHD制作成ISO系统" 本文将指导读者如何将VHD文件转换为ISO文件,整个过程涉及到多个步骤和工具,包括使用虚拟光驱、ZIP压缩工具、Imagex命令行工具和UltraISO等。 在开始之前,读者需要准备一个ISO格式...

    16进制转换成10进制

    在计算机科学和编程领域,不同进制之间的转换是基础且重要的知识。16进制(Hexadecimal)是一种逢16进一的计数系统,它使用16个符号(0-9和A-F)来表示数值。10进制是我们日常生活最常用的计数方式,从0到9,逢10进...

    pb 日期函数

    根据给定文件的信息,我们可以梳理出与“pb 日期函数”相关的多个知识点。这些知识点主要集中在日期函数的应用、计算及转换上。以下是对各部分详细解释: ### 1. 获取年份的最后两位数字(Ф(ݲintls_yearزstring)...

    多边形合并:使用 multiPolygon, polygon 方法进行合并

    多边形合并:使用 multiPolygon, polygon 方法进行合并,具体合并可以参考文章如下:https://zhuhukang.blog.csdn.net/article/details/133716577

    基于神经网络的歌声合成系统`内含数据集以及成成样本'环境搭建教程.zip

    在本教程中,我们将深入探讨如何搭建一个基于神经网络的歌声合成系统,该系统利用了提供的数据集和预训练模型。首先,我们需要了解歌声合成的基本原理,它涉及到将文本或音符转换为真实的人声输出。传统的歌声合成...

    初中语文文摘社会成成的理想世界

    9. **家庭教育的角色**:成成的母亲在教育过程中扮演了关键角色,她的理解和接纳态度影响了成成的成长,同时她也从学校中学习到了更有效的教育方法。 10. **社会包容性**:文章最后提到的社会对残疾人的普遍接受,...

    镜像转换工具

    描述中提到的“Windows下把nrg镜像转换成iso”,意味着这个过程将在Windows操作系统环境下进行。通常,这种转换需要一个专门的软件工具,这里标签中提到了“nrg转换工具”,暗示我们可能有一个名为`nrg2iso`的工具来...

    《成成烽火》观后感.pdf

    《成成烽火》这部电影将抗日战争的历史背景与中国教育者与青年学生的心路历程巧妙结合,展示了成成中学师生在民族存亡的关键时刻所表现出的英勇与智慧。这部影片不仅是对历史的艺术再现,更是对当代青年的深刻启示和...

Global site tag (gtag.js) - Google Analytics