js将form表单转成json

<!DOCTYPE html>
<head></head>
<body>
    <form id="register">
        <input type="text" name="user" value="hpc"><br>
        <input type="text" name="pwd" value="123"><br>
        <input type="text" name="sex" value="M"><br>
        <input type="text" name="age" value="100"><br>
        <input type="text" name="phone" value="13011112222"><br>
        <input type="text" name="email" value="[email protected]"><br>
    </form><br>
    Jquery 的serialize()方法
    <div id="show">

    </div><br>
    Jquery 的serializeArray()方法
    <div id="show2">

    </div><br>
    Jquery serializeArray()方法的数据转json
    <div id="show3">

    </div>
</body>
<script type="text/javascript" src="jquery-1.7.1.min.js"></script>
<script type="text/javascript">
    var register =$("#register");
    //返回字符串xxx=xxx&yyy=yyy;
    var formData = register.serialize();
    $("#show").html(formData);
    // 返回的是json数组[{xxx:xxx},{yyy:yyy}]
    formData = register.serializeArray();
    $("#show2").html(JSON.stringify(formData));

    //将json数组转为json 对象
    var jsons = transformToJson(formData);
    $("#show3").html(JSON.stringify(jsons));

    // 转为json数据格式
    function transformToJson(formData){
        var obj={}
        for (var i in formData) {
            /*[{"name":"user","value":"hpc"},{"name":"pwd","value":"123"},{"name":"sex","value":"M"},{"name":"age","value":"100"},{"name":"phone","value":"13011112222"},{"name":"email","value":"[email protected]"}]
            */
            //下标为的i的name做为json对象的key,下标为的i的value做为json对象的value
            obj[formData[i].name]=formData[i][‘value‘];
        }
        return obj;
    }
</script>

原文地址:https://www.cnblogs.com/mohehpc/p/8335183.html

时间: 2024-10-14 13:22:36

js将form表单转成json的相关文章

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

前端页面:<span style="font-size:14px;"> <form action="" method="post" id="tf"> <table width="100%" cellspacing="0" cellpadding="0" border="0"> <tr> <th&

JQuery将form表单值转换成json字符串函数

由于后台接口限定,必须要将表单内容转换成json字符串提交,因此写了一个将form表单值转成json字符串的函数.     前提:页面引入了JQuery 下面直接上代码 一.代码 /** 表单序列化成json字符串的方法 */ function form2JsonString(formId) { var paramArray = $('#' + formId).serializeArray(); /*请求参数转json对象*/ var jsonObj={}; $(paramArray).each

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

在web开发过程中,经常遇到将form序列化不能格式的字符串提交到后台,下面就介绍怎样将form表单序列化为json字符串. 首先,是扩展的jquery序列化插件,依赖jquery.经测试,这段代码可以放在$(funciton(){})中,也可以放在外面,都可以实现效果. $.fn.serializeObject = function() { var o = {}; var a = this.serializeArray(); $.each(a, function() { if (o[this.

jquery将form表单序列化常json

var formData = {};$.each(form.serializeArray(),function(i, item){ formData[item.name] = item.value;}); $.ajax({ cache: true, type: "POST", url:ajaxCallUrl, data:$('#yourformid').serialize(),// 你的formid async: false, error: function(request) { al

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

http://jsfiddle.net/sxGtM/3/http://stackoverflow.com/questions/1184624/convert-form-data-to-js-object-with-jquery /*把表单转成json,并且name为key,value为值*/ $.fn.serializeObject = function() { var o = {}; var a = this.serializeArray(); $.each(a, function() { i

js模拟form表单提交数据, js模拟a标签点击跳转,避开使用window.open引起来的浏览器阻止问题

js模拟form表单提交数据源码: /** * js模拟form表单提交 * @param {object} 参数对象 * url 必填 提交地址 * methond 选填 默认post 提交方式 post get * target 选填 默认_self 当前页面还是新页面 _self _blank * 其它参数 */ function jsFormSubmit(params) { var turnForm = document.createElement("form"); //一定要

通过js,修改所有form表单,提交JSON格式的数据

直接上代码 <script>$(function(){ //获取网页中所有的form表单 $("form").each(function(){ //注册表单的提交事件 $(this).submit(function(event) { //屏蔽表单的注册 event.preventDefault(); //获取url var url = $(this).attr("action"); request(url, 'POST', JSON.stringify(

原生js实现form表单序列化

大家都知道在jquery中有相应的表单序列化的方法: 1.serialize()方法 格式:var data = $("form").serialize(); 功能:将表单内容序列化成一个字符串. 这样在ajax提交表单数据时,就不用一一列举出每一个参数.只需将data参数设置为 $("form").serialize() 即可. 2.serializeArray()方法 格式:var jsonData = $("form").serialize

把表单数据封装成json格式 插件可用

来源:https://github.com/macek/jquery-serialize-object 请看 文件里面的jquery-serialize-object-master.zip 有一个文件:jquery.serialize-object.js , 是用来 把表单 数据  进行JSON 格式. 用法: <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&q