我有一个包含 3 个不同页面的网页：page1、page2 和 page3。
在第一页上，用户将在文本框中输入他的名字。
我想将该值存储到本地存储中，以便在第 2 页和第 3 页上再次使用。
我什至无法在第 1 页上检索它。难道我做错了什么？
而且我不知道如何在不同的页面上检索它。有什么帮助吗？
function myFunction() {
var name = document.getElementById("myInput").value;
document.getElementById("greeting").innerHTML = "Hello, " + name + "! Welcome!";
}
localStorage.setItem("userName", name);
document.getElementById("storedName").innerHTML = localStorage.getItem("userName");
<p>What is your name?</p>
<input id="myInput" type="text" placeholder="Name Surname">
<button onclick="myFunction()">Answer</button>
<p id="greeting"></p>
<p id="storedName"></p>
您只需要做一些更改：
function getName() {
return localStorage.getItem("userName");
}
function updateHTML() {
var name = getName();
document.getElementById("greeting").innerHTML = "Hello, " + name + "! Welcome!";
document.getElementById("storedName").innerHTML = name;
}
function myFunction() {
// Gets input value
var name = document.getElementById("myInput").value;
// Saves data to retrieve later
localStorage.setItem("userName", name);
// Updates HTML
updateHTML();
}
请注意，您的代码没问题；唯一的问题是有两行代码在函数之外，仅此而已。
然后，在您的其他页面中，您可以使用 updateHTML 函数：
编辑：我做了一个附加函数，这样当您只需检索数据时就可以重用代码。此外，将代码分开总是一个好主意，这样更容易理解和维护。希望有帮助；如果没有请告诉我。
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
