Question

我正在尝试制作一个小型游戏，但是从localStorage加载名称密钥并将其放入标签时遇到问题。

<div id="profilescr" class="thetab">
    <h3 id="tpname"></h3>
</div>

if(localStorage.user === undefined) {
    localStorage.user = prompt("Name plz");
    document.getElementById("tpname").innerHTML = localStorage.user;
}

我成功存储了.user，但是没有显示在<h3>标签中。

Answer 1

仅在不存储值时更新h3。如果存储的是值，则说明您没有更新它，因为您已将更新放在中if内。将其移到其外部：

if(localStorage.user === undefined) {
    localStorage.user = prompt("Name plz");
}
document.getElementById("tpname").innerHTML = localStorage.user; // <====

Live Example on plnkr（因为堆栈片段不允许本地存储）

Answer 2

使用方法localStorage.user和localStorage.setItem()，而不是使用localStorage.getItem()。

我会将您的代码更改为以下内容：

if(localStorage.getItem("gameInfo") === null){
    askForName();
}else{
    const userName = JSON.parse(localStorage.getItem("gameInfo")).userName;
    document.getElementById("tpname").innerHTML = userName;
}

对于askForName函数：

function askForName(){
    const name = *some input value*;
    localStorage.setItem("gameInfo", JSON.stringify({userName: name}))
}

无法将localStorage密钥加载到<h>标签

2 个答案: