使用 javascript 记住用户在之前的页面上做了什么选择？

Question

我有一些页面，在最后一页上我需要知道用户在最后两页上做出了什么选择。像这样：

a.html 用户在这里有三个选择，将他/她带到不同的网址。我需要以某种方式保存这个选择并在以后使用它。

例子：

<script>globalVariable1="firstchoice"</script>

b.html 这是三个选择页面之一，这里用户有 3-4 个新选择，可以将他/她带到不同的 url。我还需要以某种方式保存这个选择以供以后使用。

例子：

<script>globalVariable2="thirdchoice"</script>

c.html 这是我需要知道用户之前做出了什么选择的页面。如果用户想返回我的面包屑解决方案，则能够链接回那些确切的页面。

例子：

<script>
  if(globalVariable1 == "firstchoice"){
    //do this
  }
  if(globalVariable2 == "thirdchoice"){
    //do this
  }

</script>

我可以用 javascript 中的一些全局变量来做到这一点吗？或者我该如何解决这个问题？

谢谢

Answer 1

您可以使用本地存储。即使您在页面之间导航、重新加载页面或关闭并重新打开浏览器，它也会保留键/值对的浏览器 API。

//setting a value
localStorage["foo"] = "bar";

//getting a value
var x = localStorage["foo"];

使用 sessionStorage 也可以。

//setting a value
sessionStorage["foo"] = "bar";

//getting a value
var x = sessionStorage["foo"];

维基百科的Web Storage文章将 localStorage 和 sessionStorage 之间的区别描述为：

放置在本地存储中的数据是针对每个域的（它可供最初存储数据的域中的所有脚本使用），并且在浏览器关闭后仍然存在。会话存储是每页每窗口的，并且仅限于窗口的生命周期。会话存储的目的是允许同一 Web 应用程序的不同实例在不同的窗口中运行，而不会相互干扰，而 cookie 不能很好地支持这种用例。