我创建了一个函数，其中我的表单的输入值正在一个对象中收集然后我将整个对象推入一个数组并将我的数组保存在本地存储中...但问题是当我更改值并签名时再次我的旧值被新的覆盖，但我希望它推动数组的索引1，以便我的数组包含2个对象等等...请帮助我感谢你。
<script>
var labelsarray = document.getElementsByTagName("label");
var inputsarray = document.getElementsByTagName("input");
var array = [];
function subm() {
var users = {
FirstName: inputsarray[0].value,
LastName: inputsarray[1].value,
UserName: inputsarray[2].value,
Password: inputsarray[3].value,
DateofBirth: inputsarray[4].value,
Age: inputsarray[5].value,
Purpose: ""
};
if (inputsarray[6].checked === true) {
users.Gender = "Male";
}
else if (inputsarray[7].checked === true) {
users.Gender = "Female";
}
if (inputsarray[8].checked === true) {
users.Purpose += " Storing Apps";
}
if (inputsarray[9].checked === true) {
users.Purpose += " Storing Sites";
}
if (inputsarray[10].checked === true) {
users.Purpose += " Fun";
}
array.push(users);
for (var i=0;i<array.length;i++) {
localStorage.setItem("User Data: ", JSON.stringify(array[i]));
}
}
</script> <div>
<center>
<form action="Javascript:void(0);"method="post" onsubmit="subm();">
<label for="fname">First Name:</label> 
<input type="text" id="fname" />
<br/>
<label for="lname">Last Name:</label> 
<input type="text" id="lname" />
<br/>
<label for="uname">User Name:</label> 
<input type="text" id="uname" />
<br/>
<label for="pass">Password:</label>  
<input type="text" id="pass" />
<br/>
<label for="dob">Date of Birth:</label>  
<input type="date" id="dob" />
<br/>
<label>Age:</label>     
<input type="text" id="age" />
<br/>
<span>Gender:</span>     
<input type="radio" name="gender" id="male" />
<label for="male">Male</label>
<input type="radio" name="gender" id="female" />
<label for="female">Female</label>
<br/>
<p>For what purpose(s) you are making account?</p>
<input type="checkbox" id="app" name="purpose" value="storingapps" />
<label for="app">Storing Apps</label>
<input type="checkbox" id="site" name="purpose" value="storingsites" />
<label for="site">Storing Sites</label>
<input type="checkbox" id="fun" name="purpose" value="fun" />
<label for="fun">Fun</label>
<br/>
<input type="submit" value="Submit" class="button" />
</form>
</center>
</div>
答案 0 :(得分：0)
每次保存在本地存储中时，您只保存最后一项。因为每个保存将被下一个保存替换，只有最后一个保存可见。相反，您只需要将阵列保存到本地存储
// (not needed) for (var i=0;i<array.length;i++) {
localStorage.setItem("User Data: ", JSON.stringify(array));
// (not needed) }
现在您的本地存储将包含对象数组
答案 1 :(得分：0)
您每次都在重新创建阵列，而不是从本地存储中读取它。因此，每次都是从一个新阵列开始。
你正在做var array = [];，你应该从本地存储中读取。
var array = [];
var savedArrayJSON = localStorage.getItem("userData");
if (savedArray) {
try {
array = JSON.parse(savedArrayJSON);
} catch (e) {
// Probably do nothing
}
}
...
array.push(users);
// No more for-loop
localStorage.setItem("userData", JSON.stringify(array));
答案 2 :(得分：0)
设置数组后，循环遍历它，每次迭代时都会覆盖User Data中最后一次迭代的localStorage键，因此只有最后一个数组项存储
for (var i=0;i<array.length;i++) {
localStorage.setItem("User Data: ", JSON.stringify(array[i]));
}
您应该将整个数组设置为本地存储，或者使用不同的键来存储各个项目：
localStorage.setItem("User Data: ", JSON.stringify(array));
接下来，每当有人访问您的网页时，您都会创建一个新的空数组，那么localStorage中的数据何时被拉出并使用？在页面访问时，您应该获取已保存的数据，以便您可以更多地进入它：
// Set the array variable equal to the array in localStorage or an empty array
var array = JSON.parse(localStorage.getItem("User Data")) || [];
其他说明：
您的HTML无效，并且遵循过时的方法。
Javascript:void(0);
不仅错误大写（应该是javascript:void()），而且不应该使用整个无所作为的技术以及onsubmit（ {{3} } ）。您的所有JavaScript都应该使用专用脚本，并且应使用 HTML event handling attributes 完成事件处理。
<center>已弃用。所有格式都应该用CSS完成。
<input>和<br>元素不应在标记末尾使用/>的XML自终止语法。虽然这是合法的，但当世界认为XML将成为未来时，它是2000年的遗留物。它在您的代码中没有购买任何内容 element.addEventListener() 。
答案 3 :(得分：0)
您可以尝试以下代码。这是因为您每次创建新用户时都会覆盖localStorage值。一个简单的解决方案是以数组格式存储用户，并在每次新用户填写时向其添加新用户然后将其保存到localStorage。
```
<script>
var labelsarray = document.getElementsByTagName("label");
var inputsarray = document.getElementsByTagName("input");
//Here We first Grab the already stored value from the localStorage and parse it because it is in string format.
var array = JSON.parse(localStorage.getItem('User Data: ')) || [];
function subm() {
var users = {
FirstName: inputsarray[0].value,
LastName: inputsarray[1].value,
UserName: inputsarray[2].value,
Password: inputsarray[3].value,
DateofBirth: inputsarray[4].value,
Age: inputsarray[5].value,
Purpose: ""
};
if (inputsarray[6].checked === true) {
users.Gender = "Male";
}
else if (inputsarray[7].checked === true) {
users.Gender = "Female";
}
if (inputsarray[8].checked === true) {
users.Purpose += " Storing Apps";
}
if (inputsarray[9].checked === true) {
users.Purpose += " Storing Sites";
}
if (inputsarray[10].checked === true) {
users.Purpose += " Fun";
}
//We Now append the users to the array and save it to localStorage.
array.push(users);
localStorage.setItem("User Data: ", JSON.stringify(array));
}
``` 我希望这也适合你。