javascript - 如果页面刷新/重新加载，提示仅触发一次并存储值

Question

我的页面上有一个提示，询问用户的年龄。如果超过 18 岁，则允许用户访问主页，否则，他们将被重定向到另一个网站。

问题是如果我进入另一个页面然后返回主页，提示会再次触发，再次询问用户的年龄。

有什么方法可以存储第一次输入的值，防止再次触发提示？

这是我的代码：

Javascript：

   var ageCheck = prompt("How old are you?")
    if (ageCheck >= 18) {
        alert("Welcome to Ginspiration!");
    }
    else {
      alert("You must be at least 18 years old to be allowed on this website. You will be redirected.")
        window.location.href="https://www.drinkaware.co.uk/advice/underage-drinking";
    }

谢谢！

标签： javascript

Answer 1

一种方法是使用localStorage. 它将您的数据直接存储到您的浏览器中。

举个例子：

localStorage.setItem('myCat', 'Mimi');

console.log(localStorage.getItem('myCat'));

如果我得到您的代码，它将如下所示：

// Get the age from local storage
 const ageCheck = localStorage.getItem("age");
 
 if(!ageCheck){
  // If ageCheck is null then we prompt "How old are you?" and set the item
   const age = prompt("How old are you?")
   localStorage.setItem("age", age);
 } else {
  // Else we check the age 
  if (ageCheck >= 18) {
        alert("Welcome to Ginspiration!");
    }
    else {
      alert("You must be at least 18 years old to be allowed on this website. You will be redirected.")
        window.location.href="https://www.drinkaware.co.uk/advice/underage-drinking";
    }
}