Javascript 存在动态列表操作时的表单到json错误

我的应用程序中有一个地址，有一个按钮可以在必要时添加地址，但是当我将表单传输到对象并使用ajax提交时，表单对象将只包含最后一个地址。这是你的电话号码

编辑

---

这个问题已经部分修复，但我们仍然在考虑是否添加了remove函数，我们如何控制列表的索引，如果有人有好主意，您可以给我一个评论，谢谢，感谢@weeksdev的帮助。问题是输入对象的名称对于所有输入都是相同的。修改名称进行迭代，所有输入显示在输出中。看看这个例子

以下是更改的对应代码：

选项1:

$(".addAddress").click(function(){
    $("#addressEare").append(' <br><input type="text" readonly="readonly" name="person.addresses.name' + i + '" value="address'+i+'" class="addressName" />');
    i++;
});

<form id="i_form">
    <div id="addressEare" name="">
        <input type="text" readonly="readonly" name="person.addresses[0].name" value="address1" class="addressName" />
    </div>
    <input type="button" value="Add Address" class="addAddress"/>
    <input type="button" value="Show Form Object" class="showFormObj"/>
</form>

var i=2;
$(".addAddress").click(function(){
    $("#addressEare").append(' <br><input type="text" readonly="readonly" name="person.addresses[' + i + '].name" value="address'+i+'" class="addressName" />');
    i++;
});
$(".showFormObj").click(function(){
    var formObj = form2js("i_form",".");
    alert(JSON.stringify(formObj));
});

JS:

$(".addAddress").click(function(){
    $("#addressEare").append(' <br><input type="text" readonly="readonly" name="person.addresses.name' + i + '" value="address'+i+'" class="addressName" />');
    i++;
});

<form id="i_form">
    <div id="addressEare" name="">
        <input type="text" readonly="readonly" name="person.addresses[0].name" value="address1" class="addressName" />
    </div>
    <input type="button" value="Add Address" class="addAddress"/>
    <input type="button" value="Show Form Object" class="showFormObj"/>
</form>

var i=2;
$(".addAddress").click(function(){
    $("#addressEare").append(' <br><input type="text" readonly="readonly" name="person.addresses[' + i + '].name" value="address'+i+'" class="addressName" />');
    i++;
});
$(".showFormObj").click(function(){
    var formObj = form2js("i_form",".");
    alert(JSON.stringify(formObj));
});

var i=2；
$（“.addAddress”）。单击（函数（）{
$（“#addressEare”）.append（“
”）；
i++；
});
$（“.showFormObj”）。单击（函数（）{
var formObj=form2js（“i_form”，即“）；
警报（JSON.stringify（formObj））；
});

---

这里演示的是选项2

您正在一次又一次地覆盖同一对象的同一属性。@ErikReppen，但我想在后台提供一个列表，就像{addresses:[{name:1}，{name:2}}}选项2很酷，我解决了这个问题并