这是我的 home.html 代码。我按下了另一个 .html 文件中的按钮。名称被添加并存储在另一个文件的数组中，并通过 localStorage 传递并在 home.html 中解析。然后我循环遍历数组来打印名称。我的问题是在服务器上的网页上显示名称，但在我提交名称后，它会替换网页上以前的名称。它并不是列出一个名字后面跟着另一个名字的列表。我可以使用 javascript 添加一些内容，这样名称就不会不断更新或刷新吗？谢谢！
home.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title> Home Page </title>
{% extends "navigation.html" %}
{% block content %}
<p> List of Names: </p>
<ul id="List"></ul>
</head>
<body>
<script>
var LL = JSON.parse(localStorage.getItem("newList1"));
document.getElementById("List").innerHTML += "<li>" + LL[LL.length-1] + "</li>";
</script>
</body>
{% endblock %}
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title> Add Name Page </title>
{% extends "navigation.html" %}
{% block content %}
<p> Add a name: </p>
<form action="home.html">
<input type='text' input name='name' id='addname'>
<input type="button" id="add" value="Submit" onclick="passVal()">
</form>
<ul id="nameList"></ul>
add_name.html
</head>
<body>
<script>
function passVal() {
newList = [];
var newName = document.getElementById("addname").value;
newList.push(newName); //Note: push in javascript assigns value to newList. If I set this to a variable, it would only store the number of elements in that list
localStorage.setItem("newList1", JSON.stringify(newList));
}
</script>
</body>
{% endblock %}
</html>
喵喵时光机
相关分类