<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="js/jquery.min.js"></script>
    <script type="text/javascript">
        (function($){
            $.fn.serializeJson=function(filter){
                var serializeObj={};
                var array=this.serializeArray();
                var str=this.serialize();
                $(array).each(function(){
                    if(this.name!=filter){
                        if(serializeObj[this.name]){
                            if($.isArray(serializeObj[this.name])){
                                serializeObj[this.name].push(this.value);
                            }else{
                                serializeObj[this.name]=[serializeObj[this.name],this.value];
                            }
                        }else{
                            serializeObj[this.name]=this.value;
                        }
                    }
                });
                return serializeObj;
            };
        })(jQuery);

        function addP(){
            var json=$("#myform").serializeJson("data");
            //json转String
            console.log(JSON.stringify(json));
        }
    </script>
</head>
<body>
<form name="myform" id="myform" method="post">
    <div>
    姓名:<input type="text" name="pname" id="pname"/>
    年龄:<input type="text" name="age" id="age"/>
    兴趣:<textarea id="interest" name="interest"></textarea>
    </div>
    <div>
        <button type="button" onclick="addP();">提交</button>
    </div>
</form>

</body>
</html>

表单数据转换成json格式数据的更多相关文章

  1. <form> 标签 // HTML 表单 // from 表单转换成json 格式

    <form> 标签   // HTML 表单    // from 表单转换成json 格式 form 表单,对开发人员来说是在熟悉不过的了,它是页面与web服务器交互时的重要信息来源 表 ...

  2. form表单序列化为json格式数据

    在web开发过程中,经常遇到将form序列化不能格式的字符串提交到后台,下面就介绍怎样将form表单序列化为json字符串. 首先,是扩展的jquery序列化插件,依赖jquery.经测试,这段代码可 ...

  3. 将表单数据转换成json字符串

    $("#theForm").serialize(); 可以获取表单的数据,但是是json字符串 需要转换成json才能正常使用

  4. form表单数据封装成json格式并提交给服务器

    1.jsp代码,form表单: <form action="#" id="costForm"> <input type="hidde ...

  5. jquery自动将form表单封装成json的具体实现

    前端页面:<span style="font-size:14px;"> <form action="" method="post&q ...

  6. java将XML文档转换成json格式数据

    功能 将xml文档转换成json格式数据 说明 依赖包:1. jdom-2.0.2.jar : xml解析工具包;2. fastjson-1.1.36.jar : 阿里巴巴研发的高性能json工具包 ...

  7. 把表单转成json,并且name为key,value为值

    http://jsfiddle.net/sxGtM/3/http://stackoverflow.com/questions/1184624/convert-form-data-to-js-objec ...

  8. PHP将数据库的数据转换成json格式

    header('content-type:application/json;charset=utf8');  $results = array();     while ($row = mysql_f ...

  9. 表单配置项写法，表单写成JSON数组套对象，一行是一个数组单位，一列是一个对象单位，然后再写一个公共组件读取这个配置，循环加载slot，外层载入slot的自定义部分，比如input select等，这种写法就是把组件嵌套改为配置方式

    表单配置项写法,表单写成JSON数组套对象,一行是一个数组单位,一列是一个对象单位,然后再写一个公共组件读取这个配置,循环加载slot,外层载入slot的自定义部分,比如input select等,这 ...

随机推荐

  1. 【Python编程：从入门到实践】chapter9 类

    chapter9 类 9.1 创建和使用类 9.1.1 创建Dog类 class Dog(): """一次模拟小狗的简单尝试""" def ...

  2. 【Linux_Unix系统编程】chapter7 内存分配

    Chapter7 内存分配本章将用于在堆或者栈上分配内存的函数.7.1 在堆上分配内存 通常将堆的当前的内存边界称为"program break" 7.1.1 调整program ...

  3. 本地管理表空间和字典管理表空间的特点，ASSM有什么特点

    字典管理表空间(Dictionary-Managed Tablespace简称DMT),8i以前包括以后都还可以使用的一种表空间管理模式,通过数据字典管理表空间的空间使用. Oracle使用两个字典来 ...

  4. 基于Linux的Samba开源共享解决方案测试（三）

    在极限写场景下,对于网关的网络监控如图: 在极限写场景下,对于网关的网络监控如图: 在极限混合读写场景下,对于网关的网络监控如图: 在极限混合读写场景下,对于客户端的网络监控如图: 双NAS网关100 ...

  5. CPU，寄存器，一缓二缓.... RAM ROM 外部存储器等简介

    自我学习:一.线程安全日期格式化操作的几种方式:1.每次new一个新对象:public static Date parse(String date) throws ParseException { r ...

  6. 1.纯 CSS 创作一个按钮文字滑动特效 + 弹幕（残缺）

    原文地址:1# 视频演示如何用纯 CSS 创作一个按钮文字滑动特效 扩展后地址:https://scrimba.com/c/cJkzMfd HTML代码: <html> <head& ...

  7. 2.vo传参模式和ModerDriven传参模式

    转自:https://wenku.baidu.com/view/84fa86ae360cba1aa911da02.html Copy上面的myStruts2项目,改名为myStruts2Vo项目.作如 ...

  8. 基于OpenGL编写一个简易的2D渲染框架-02 搭建OpenGL环境

    由于没有使用GLFW库,接下来得费一番功夫. 阅读这篇文章前请看一下这个网页:https://learnopengl-cn.github.io/01%20Getting%20started/02%20 ...

  9. 压缩文件tar.gz和zip之间的区别

    我们在开发的时候通常要先下载相关的软件或者是源码,或者是jar包.在下载东西的时候总是碰见后缀是.tar.gz和.zip的问题,搞不清楚是怎么回事,不晓得下载哪个文件才是对自己有用的.现在我知道了,其 ...

  10. linux install redis-cli

    ubuntu: sudo apt-get install redis-cli centos: sudo -i yum list redis yum install redis>>> ...