尝试使用 JavaScript 进行个性化问候

Question

我为网站制作了一个小脚本，当您加载该网站时，会有一个提示询问您的姓名，当您提交它时，它会在 header 中显示一条问候消息。

问题是，当您转到网站的不同页面时，脚本会再次执行并再次询问名称。例如，您从家转到联系人部分，当联系人部分加载时，提示再次出现。我希望它执行一次并在整个网站上显示信息。这是 JS 代码：

var nombre = sessionStorage.setItem[prompt("Bienvenido a Plantas All the Time, ingrese su nombre:")]

var login = sessionStorage.getItem(nombre);

if (nombre == "") { 
  prompt("Bienvenido a Plantas All The Time, ingrese su nombre:")

} else {
  document.getElementById('usuario').innerHTML = "<h4> Hola, " + nombre + "</h4>";

}

每当我执行此操作时，都会出现提示，我输入名称并打印“未定义”。

Answer 1

这里有很多小错误。

setItem 将一个键和一个值作为参数，而 getItem 将键（作为字符串）作为参数；将 sessionStore 视为 dictionary/map；因此，您需要提供存储密钥的名称，例如"name-key";
在逻辑上，您不应该在每次加载页面时都调用 setItem，但前提是用户尚未提供；

因此，我们的想法是首先检查存储，然后如果没有设置名称，则向用户索要一个。

这是一个工作示例：

var key = "name-key"; // key used to store the name in the sessionStorage

// first, try to retrieve the name
var name = sessionStorage.getItem(key);

if(!name){ // if no name has been provided yet
  // ask the user, and keep asking until it enters a value
  while (!name) {
    name = prompt("Bienvenido a Plantas All The Time, ingrese su nombre:");
  }
  // store the name in storage, so next time no prompt will be necessary
  sessionStorage.setItem(key, name);
}

// at this point, name is set, so you can great your user
document.getElementById('usuario').innerHTML = "<h4> Hola, " + name + "</h4>";

尝试使用 JavaScript 进行个性化问候

Trying to make a personalized greeting with JavaScript

javascript

if-statement

session-storage