Javascript 是否将表单数据存储在数组中？

需要帮助在数组中存储表单数据

表单具有显示其他字段的选项。如何获取要在数据数组中显示的其他字段值

<form id="myForm">
    <div id="input1" style="margin-bottom:4px;" class="clonedInput">

        <p>Please Enter Your First Name Last Name</p>
        <div style="border:1px solid black;padding:5px">
            <label for="first1">first:</label>
            <input type="text" name="first1" id="first1" /><br />

            <label for="last1">last:</label>
            <input type="text" name="last1" id="last1" /><br />
        </div>

        <p>Please Enter Your Address</p>
        <div style="border:1px solid black;padding:5px">    
            <label for="add1">address:</label>
            <input type="text" name="add1" id="add1" /><br />

            <select class="period" id="hour1" name="hour1">                                         
                <option value="1">1</option>
                <option value="2">2</option>
                <option value="3">3</option>
                <option value="4">4</option>
                <option value="5">5</option>
                <option value="6">6</option>
                <option value="7">7</option>
                <option value="8">8</option>
                <option value="9">9</option>
                <option value="10">10</option>
                <option value="11">11</option>
                <option value="12" selected>12</option>
            </select>
        </div>
    </div>

    <div>
        <input type="button" id="btnAdd" value="add another name" />
    </div>

    <div style="padding-top:30px">
        <input type="button" id="submit" value="submit to Object" />
    </div>
</form>

var storeData = {          
    "firstname": "",
    "lastname": "",           
    "address": "",
    "hour": ""
};

$('#btnAdd').click(function() {
   var num = $('.clonedInput').length;
   var newNum  = new Number(num + 1);

   var newElem = $('#input' + num).clone().attr('id', 'input' + newNum);        
   newElem.children(':first').attr('id', 'name' + newNum).attr('name', 'name' + newNum);

   $('#input' + num).after(newElem);

    });

$('#submit').click(function() {

    var firstname =  $('#first1').val();
    var lastname =  $('#last1').val();
    var address =  $('#add1').val(); 
    var hour =  $('#hour1').val();

    storeData.firstname = firstname;
    storeData.lastname = lastname;
    storeData.address = address;
    storeData.hour = hour;    

    console.log(storeData);
});

请输入您的名字和姓氏

第一：


最后:


请输入您的地址

地址:


1.
2.
3.
4.
5.
6.
7.
8.
9
10
11
12
var storeData={
“名”：“名”，
“姓氏”：“，
“地址”：“地址”，
“小时”：”
};
$（'#btnAdd'）。单击（函数（）{
var num=$（'.clonedInput'）.length；
var newNum=新的数字（num+1）；
var newElem=$（'#input'+num）.clone（）.attr（'id'，'input'+newNum）；
newElem.children（':first'）.attr（'id'，'name'+newNum）.attr（'name'，'name'+newNum）；
$（'#input'+num）.after（newElem）；
});
$（“#提交”）。单击（函数（）{
var firstname=$（'#first1'）.val（）；
var lastname=$（'#last1'）.val（）；
变量地址=$（'#add1'）.val（）；
var hour=$（'#hour1'）.val（）；
storeData.firstname=firstname；
storeData.lastname=lastname；
storeData.address=地址；
storeData.hour=小时；
console.log（storeData）；
});

这是我的工作示例

---

注意：第一个字段的值是在数据数组中设置的，但添加其他字段时，它们不会设置

检查新添加的元素。他们都有相同的名字；我认为你的克隆人没有按预期工作。必须循环克隆的DIV内的每个输入并更新名称

---

不要忘了为属性更新标签的

。
您可以使用
.serializeArray（）
来创建包含所有表单输入的对象：

$('#submit').click(function() {
    var data = $('#myForm').serializeArray();
    for(i in data){
        console.log(data[i]);
    }  
});

使用

var formData = $('#myForm').searialize();

这不会将表单数据放入数组，而只是查询字符串格式。
var formData = $('#myForm').searialize();