jquery 将表单中的数据收集到多个对象中

Question

我不完全确定该怎么做。

但我有一个表单，其中包含多个输入文本区域的一些 div。我想将这些收集到一个多维数组中。有点像这样：

{
    "jason" : {
        "name" : "Jason Lengstorf",
        "age" : "24",
        "gender" : "male"
    },
    "kyle" : {
        "name" : "Kyle Lengstorf",
        "age" : "21",
        "gender" : "male"
    }
}

但我不完全确定该怎么做，谷歌也没有帮助。 我的 html 看起来像这样

<form class="testForm" method="POST">

    <div class="uploadForm">
        <input class="uploadedFile" name="form1[]name[]" type="text" value="myname" />
        <input class="uploadedFile" name="form1[]phone[]" type="text" value="2019192" />
        <input class="uploadedFile" name="form1[]text[]" type="text" value="sometext" />
    </div>

    <div class="uploadForm">
        <input class="uploadedFile" name="form2[]name[]" type="text" value="myname" />
        <input class="uploadedFile" name="form2[]phone[]" type="text" value="2019192" />
        <input class="uploadedFile" name="form2[]text[]" type="text" value="sometext" />
    </div>


    <button>save</button>
</form>

和脚本收集

<script>
    $( document ).ready(function() {

        $(".testForm").submit(function(e) {
        e.preventDefault();


        var $form = $(this);

        var $inputs = $form.find("input, select, button, textarea");

        var serializedData = $form.serializeArray();
        $inputs.prop("disabled", true);

        alert(JSON.stringify(serializedData));

        })

    });
</script>

Answer 1

SerializeJSON 非常适合您在此处尝试实现的目标。

https://github.com/marioizquierdo/jquery.serializeJSON

Answer 2

首先我会尝试使用 id 的 <form class="testForm" method="POST" id="testForm">

然后使用：

var formData = JSON.stringify($("#testForm").serializeArray());

你会从你的表单中得到一个 json