Question

例如，表单包含以下名称的字段：txt01，txt02，txt03 []，txt03 []，txt04 [name] []，txt04 [name] []，txt04 [phone] []，txt04 [phone] []，txt05 [] [name]，txt05 [] [phone]，txt05 [] [name]，txt05 [] [phone]。当我向这些字段输入值并单击提交按钮时，它应生成以下Json对象：

Object {
    txt01: "Text 01",
    txt02: "Text 02",
    txt03: Array(2) {
        0: "Text 01",
        1: "Text 02"
    },
    txt04: Object 
    {
        name: Array()
        {
            0: Text 01
            1: Text 02
        },

        phone: Array()
        {
            0: 000001
            1: 000002
        }
    },
    txt05: Array(2) 
    {
        0: Object
        {
            name: Text 01
            phone: 000001
        },

        1: Object
        {
            name: Text 02
            phone: 000002
        }
    }

}

下面是要序列化为Json Object的表单。将执行序列化的脚本应该生成上面的Json对象。

<form>
    <input type="text" name="txt01" value="Text 01" />
    <input type="text" name="txt02" value="Text 02" />

    <input type="text" name="txt03[]" value="Text 01" />
    <input type="text" name="txt03[]" value="Text 02" />

    <input type="text" name="txt04[name][]" value="Text 01" />
    <input type="text" name="txt04[name][]" value="Text 02" />
    <input type="text" name="txt04[phone][]" value="000001" />
    <input type="text" name="txt04[phone][]" value="000002" />

    <input type="text" name="txt05[][name]" value="Text 01" />
    <input type="text" name="txt05[][phone]" value="000001" />
    <input type="text" name="txt05[][name]" value="Text 02" />
    <input type="text" name="txt05[][phone]" value="000002" />

    <input type="submit" value="Submit" />
</form>

Answer 1

我在这里做了一些研究，但我没有找到适合我正在做的事情的回应，所以我创建了一个解决方案。有关详细信息，请访问https://github.com/citnvillareal/serializeObject

请不要犹豫不决。我希望这可以提供帮助。

Answer 2

只想分享我的想法。我只是使用本机javascript为json开发一个应用程序表单。您可以访问此链接：https://github.com/jhanxtreme/form-to-json

示例表格

<form name="f1" onsubmit="return formToJson(this);">
   <input type="text" name="username" value="dummyuser" / >
   <input type="password" name="password" value="password123" />
   <input type="submit" />
</form>

JSON OUTPUT：

{
 username:"dummyuser",
 password:"password123"
}

此外，这会将包括HTML5在内的大多数表单元素映射到JSON数据中。希望这对你有所帮助。

Answer 3

$.fn.serializeObject = function()
{
    var o = {};
    var a = this.serializeArray();
    $.each(a, function() {
        if (o[this.name] !== undefined) {
            if (!o[this.name].push) {
                o[this.name] = [o[this.name]];
            }
            o[this.name].push(this.value || '');
        } else {
            o[this.name] = this.value || '';
        }
    });
    return o;
};

这是Convert form data to JavaScript object with jQuery

您可能会尝试一些听起来像很多人可以使用的东西：）

Answer 4

仍然不清楚要求，但我想你可以做那样的事情

 var frm = $('form');
 var data = JSON.stringify(frm.serializeArray());

Answer 5

var myObj = new Object();
myObj.text01 = "Text 01";
myObj.text02 = "Text 02";
.
.
.
var string =JSON.stringify(myObj);

如何将表单字段转换为Json对象？

5 个答案: