1. <body>
  2.         <form action="#" method="post" id="form1">
  3.             <input type="text" name="username" value="zhangxueliang"/>
  4.             <input type="text" name="password" value="123456"/>
  5.             <input type="checkbox" name="hobby" value="eat" checked="checked"/>
  6.             <input type="checkbox" name="hobby" value="drink" checked="checked"/>
  7.             <input type="checkbox" name="hobby" value="play" checked="checked"/>
  8.         </form>
  9.     </body>
  10.     <script src="js/jquery-1.8.3.js" type="text/javascript" charset="utf-8"></script>
  11.     <script type="text/javascript">
  12.         $.fn.extend({
  13.             serializeJson:function(){
  14.                 var json={};
  15.                 var msg = this.serializeArray();
  16.                 $(msg).each(function(){
  17.                     if(json[this.name]){//如果name已存在
  18.                         if(!json[this.name].push){//能push代表是数组
  19.                             //不是数组
  20.                             json[this.name]=[json[this.name]];
  21.                         }
  22.                         json[this.name].push(this.value||"");//装入数组
  23.                     }else{
  24.                         json[this.name]=this.value||"";
  25.                     }
  26.                 });
  27.                 return json;
  28.             }
  29.         });
  30.  
  31.         $(function(){
  32.             var formData = $("#form1").serializeJson();
  33.             console.info(formData);
  34.         })
  35.     </script>

将表单数据转换为json代码分享的更多相关文章

  1. 使用JQuery将前端form表单数据转换为JSON字符串传递到后台处理

    一般地,我们在处理表单(form表单哦)数据时,传输对象或字符串到后台,Spring MVC或SpringBoot的Controller接收时使用一个对象作为参数就可以被正常接收并封装到对象中.这种方 ...

  2. Js:消息弹出框、获取时间区间、时间格式、easyui datebox 自定义校验、表单数据转化json、控制两个日期不能只填一个

    (function ($) { $.messageBox = function (message) { $.messager.show({ title:'消息框提示', msg:message, sh ...

  3. jQuery实现form表单序列化转换为json对象功能示例

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...

  4. PHP表单数据写入MySQL代码

    <h1>插入操作</h1> <?php if(!isset($_POST['submit'])){ //如果没有表单提交,显示一个表单 ?> <form ac ...

  5. form表单数据进行json转换

    $.fn.serializeJson = function() { var o = {}; var a = this.serializeArray(); $.each(a, function() { ...

  6. JSON编码格式提交表单数据详解

    以JSON编码格式提交表单数据是HTML5对WEB发展进化的又一大贡献,以前我们的HTML表单数据是通过key-value方式传输的服务器端,这种形式的传输对数据组织缺乏管理,形式十分原始.而新出现的 ...

  7. Vue学习之--------Vue中收集表单数据（使用v-model 实现双向数据绑定、代码实现）（2022/7/18）

    文章目录 1.Vue中实现表单数据的收集 1.1 基础知识 1.2 代码实例 1.3 测试效果 1.4 额外插一嘴 1.Vue中实现表单数据的收集 1.1 基础知识 表单中常用的标签:input(输入 ...

  8. .net之工作流工程展示及代码分享（一）工作流表单

    Workflow表单的作用是能够在客户端进行表单设计,然后在流程中动态开放哪些输入框可以供用户填写. 在这里我扩展了一个常用的WebEditor工具——KindEditor,能够插入自定义的html符 ...

  9. C#中把Datatable转换为Json的5个代码实例

    一. /// <summary> /// Datatable转换为Json /// </summary> /// <param name="table" ...

随机推荐

  1. 【存储】RAID磁盘阵列选择

    RAID磁盘阵列(Redundant Arrays of Inexpensive Disks) 一个基本思想:将多个容量较小.相对廉价的磁盘进行有机组合,从而以较低的成本获得与昂贵大容量磁盘相当的容量 ...

  2. 【CQOI2012】局部极小值

    [CQOI2012]局部极小值 Description 有一个\(n\)行\(m\)列的整数矩阵,其中\(1\)到\(nm\)之间的每个整数恰好出现一次.如果一个格子比所有相邻格子(相邻是指有公共边或 ...

  3. 一款国内好用的Linux发行版？Deepin（深度）Linux

    一款国内好用的Linux发行版?Deepin(深度)Linux 目前来说,要将Linux作为桌面解决方案,对于大多数PC用户来说,当然是不现实的,毕竟Linux的主力用户群体依然是少数极客用户.说白了 ...

  4. content-box和border-box

    理解box-sizing属性border-box,content-box,其实也是理解正常盒模型与异常盒模型. 如果不做特殊说明,我们日常所用的div都是正常盒子模型. 正常盒子模型 正常盒子模型,是 ...

  5. .Net使用Redis详解之ServiceStack.Redis（七） 转载https://www.cnblogs.com/knowledgesea/p/5032101.html

    .Net使用Redis详解之ServiceStack.Redis(七)   序言 本篇从.Net如何接入Reis开始,直至.Net对Redis的各种操作,为了方便学习与做为文档的查看,我做一遍注释展现 ...

  6. element not interactable，这种提示表示元素当前在页面上不可见

    1.出现element not interactable,发现这个元素在页面上不可见,需要拖动下拉框才能看到这个元素 2.这个时候需要让元素在页面上可见,才可操作

  7. day15--认识模块、导入模块、自执行与模块的区别

    一.认识模块 什么是模块? 模块本质是一些功能的集合体 创建的一个py文件就是一个模块 使用模块: 在使用模块的py文件中 通过  import 或者 from import导入模块 模块的优点: 可 ...

  8. Egg入门学习(一)

    一:什么是Egg? 它能做什么?Egg.js是nodejs的一个框架,它是基于koa框架的基础之上的上层框架,它继承了koa的,它可以帮助开发人员提高开发效率和维护成本.Egg约定了一些规则,在开发中 ...

  9. mac 下利用AndroidStudio APK获取签名信息

    注:网上没找到特别好的.不是xxx.keystore 就是debug.keystore 而真正去找这些目录的时候系统就会提示没有这个秘钥库文件.所以就悲剧了 下面附上快速查看APK签名信息的方法(SH ...

  10. 深入源码理解ThreadLocal和ThreadLocalMap

    一.ThreadLoacl的理解: 官方的讲: ThreadLocal是一个本地线程副本变量工具类,主要用于将私有线程和该线程存放的副本对象做一个映射,各个线程之间的变量互不干扰 通俗的讲: Thre ...