Question

我正在尝试了解sessionStorage的工作原理。我知道如何使它存储一些变量并恢复它但我想做一些不同的事情。

来自w3schools的

This link展示了如何使用函数显示/隐藏元素。我的网站上有一个非常类似的设置。所以我想让它在w3schools的例子上工作，然后我会知道如何在我的网站上应用它。

你是否可以编辑w3schools代码，使其使用会话存储来恢复最后一个选项（显示或隐藏），以便我可以解决它的工作原理并自己应用它？

提前致谢。

Answer 1

你去了：

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
</head>
<body>
    <p id="hideMe">some text</p>
    <button id="hide">hide</button>
    <button id="show">show</button>

    <script>    
        $(function(){
        $("#hide").click(function(){
        $("#hideMe").hide()
        sessionStorage.setItem('hidden', 'true');
      })
      $("#show").click(function(){
        $("#hideMe").show()
        sessionStorage.setItem('hidden', 'false');
      })
      sessionStorage.getItem('hidden') === 'true' ? $("#hideMe").hide() : null
    })
    </script>
</body>
</html>

（fiddle）

但我说这不是你要找的东西。 sessionStorage将在页面重新加载后继续存在，但只要您关闭标签/窗口，它就会消失。

sessionStorage属性允许您访问会话存储对象。 sessionStorage类似于Window.localStorage，唯一的区别是当localStorage中存储的数据没有到期设置时，存储在sessionStorage中的数据在页面会话结束时被清除。只要浏览器处于打开状态，页面会话就会持续，并且会在页面重新加载和恢复后继续存在。在新选项卡或窗口中打开页面将导致启动新会话，这与会话cookie的工作方式不同。（https://developer.mozilla.org/de/docs/Web/API/Window/sessionStorage）

sessionStorage麻烦

1 个答案: