使用localStorage刷新示例后，如何使更改后的JavaScript变量保持不变

Question

I know some people have asked this question before, but I never get it. 我知道有人之前曾问过这个问题，但我从来没有听过。 I'm going to use another question as an example. 我将使用另一个问题作为示例。 Say I have a variable that has a value of 1. I click a button that changes it to 2. I refresh, but I want the variable to still stay at 2. Someone in that question answered and said to use localStorage, but I don't get it AT ALL. 假设我有一个值为1的变量，我单击了将其更改为2的按钮。我刷新了，但我希望变量仍保持为2。该问题中有人回答说要使用localStorage，但我不知道一点都不明白。 I tried several times, and it never worked. 我尝试了几次，但没有成功。 Can someone please give an example of a complete JS file using it? 有人可以举例说明使用它的完整JS文件吗？ What I mean is I don't want the answer to just be- "Use this to set you variable: localStorage.setItem("test", test); and this to get it: var test = localStorage.getItem("test");" 我的意思是我不希望答案只是-“使用它来设置变量：localStorage.setItem（“ test”，test）;并得到它：var test = localStorage.getItem（“ test” ）;“ I want a full example with all the code. 我想要所有代码的完整示例。 Here's what I'm talking about, except I made this so it doesn't work: 这就是我在说的，除了我做了这个，所以它不起作用：

<html>
<body onload="getItem()">
  <p id="tt">1</p>
  <button onclick="changeTest()">changetest</button>
</body>
<script>

var test = 1;
localStorage.setItem("test", test);

function changeTest()
{
    test = 2;
    document.getElementById("tt").innerHTML = test;
    localStorage.setItem("test", test);
}

function getItem()
{
    localStorage.getItem("test");
    document.getElementById("tt").innerHTML = test;
}
</script>
</html>

Answer 1

window.localStorage.getItem returns the variable, it does not import it, because the variable is already in the script. window.localStorage.getItem 返回变量，但不会导入该变量，因为该变量已在脚本中。 For example: 例如：

var test = window.localStorage.getItem("test");

You can also use window.localStorage.test , the main difference being that no storage event fires (if I'm not mistaken) 您还可以使用window.localStorage.test ，主要区别是不会触发任何存储事件（如果我没记错的话）

Answer 2

Your mistake is in setting the localstorage.test to test=1 on the load of the page each time. 您的错误是每次将页面加载时将localstorage.test设置为test = 1。

Second in the get function you are not assigning the value of localstorage to test variable. 其次，在get函数中，您没有将localstorage的值分配给测试变量。

this is a working code: 这是一个工作代码：

         <!DOCTYPE html>


         <html>
        <body onload="getItem()">
              <script>

        var test ;


          function changeTest()
          {
            test = 2;

          document.getElementById("tt").innerHTML = test;
           localStorage.setItem("test", test);   

          }

        function getItem() 
         {
             alert(typeof localStorage.test === "undefined")
       test=  typeof localStorage.test === "undefined" ? 1 : localStorage.test
       alert(test)
        document.getElementById("tt").innerHTML = test; 
         }    
          </script> 
          <p id="tt">1</p>
         <button onclick="changeTest()">changetest</button>

        </body>

         </html>

使用localStorage刷新示例后，如何使更改后的JavaScript变量保持不变

问题描述

2 个解决方案

解决方案1
0 2014-03-19 23:08:23

解决方案2
0 2014-03-19 23:32:24

使用localStorage刷新示例后，如何使更改后的JavaScript变量保持不变

问题描述

2 个解决方案

解决方案1 0 2014-03-19 23:08:23

解决方案2 0 2014-03-19 23:32:24

解决方案1
0 2014-03-19 23:08:23

解决方案2
0 2014-03-19 23:32:24