在LocalStorage中保存值,单击

Saving Values in LocalStorage onclick?

本文关键字:单击 保存 LocalStorage      更新时间:2023-09-26

尝试保存此值到本地存储每次用户点击向上或向下?

<script>
   var Clicks = 800;
   function UpClick() {
      Clicks = Clicks + 25;
      document.getElementById('CountedClicks').innerHTML = Clicks + '';
      if (Clicks > 950) {
         Clicks = 950;
      }
   }
   function DownClick() {
      Clicks = Clicks - 25;
      document.getElementById('CountedClicks').innerHTML = Clicks + '';
      if (Clicks <= 0) {
        Clicks = 25;
      }
   }
</script>
<span id="CountedClicks">800</span>
  <input type="image" src="http://findicons.com/files/icons/2332/super_m/64/navigation_up_button.png" name="1462_EXPOSURE_TI_UP" value="1462_EXPOSURE_TI_UP_BUTTON_WAS_CLICKED" onclick="UpClick()" />
  <input type="image" src="http://findicons.com/files/icons/2332/super_mono/64/navigation_down_button.png" name="1462_EXPOSURE_TI_DOWN" value="" onclick="DownClick()" />

把它做成jsfiddle: http://jsfiddle.net/JRxcr/6/

似乎无法掌握getItem或settitem的窍门,已经阅读了几个小时的材料,但还是不明白,希望有人能帮助

谢谢…

这些是我在做一些实验时想到的。

window.localStorage。setItem("点击",20);

window.localStorage.getItem("点击");

所以所有的东西都像…

<script>
    var Clicks = 800;
function UpClick() {
    Clicks = Clicks + 25;
    document.getElementById('CountedClicks').innerHTML = Clicks + '';
    document
    if (Clicks > 950) {
        Clicks = 950;
    }
}
function DownClick() {
    Clicks = Clicks - 25;
    document.getElementById('CountedClicks').innerHTML = Clicks + '';
    if (Clicks <= 0) {
        Clicks = 25;
    }
}
function SaveClicks(){
    window.localStorage.setItem('clicks',Clicks);
}
function GetClicks(){
    return window.localStorage.getItem('clicks');
}
</script>
<span id="CountedClicks">800</span>
<input type=
      "image" src="http://findicons.com/files/icons/2332/super_mono/64/navigation_up_button.png" name="1462_EXPOSURE_TI_UP" value=
      "1462_EXPOSURE_TI_UP_BUTTON_WAS_CLICKED" onclick="UpClick();SaveClicks();" />
<input type="image" src="http://findicons.com/files/icons/2332/super_mono/64/navigation_down_button.png" name="1462_EXPOSURE_TI_DOWN" value="" onclick="DownClick();SaveClicks();" />
        <script>
        function UpClick() {
            var count = JSON.parse( localStorage.count )
            Clicks = count + 25;
            document.getElementById('CountedClicks').innerHTML = Clicks;
            if (Clicks > 950) {
                Clicks = 950;
            }
            localStorage.count = JSON.stringify( Clicks );
        }
        function DownClick() {
            var count = JSON.parse( localStorage.count )
            Clicks = Clicks - 25;
            document.getElementById('CountedClicks').innerHTML = Clicks;
            if (Clicks <= 0) {
                Clicks = 25;
            }
            localStorage.count = JSON.stringify( Clicks );
        }
        </script>
        <span id="CountedClicks">800</span>
        <input type=
              "image" src="http://findicons.com/files/icons/2332/super_mono/64/navigation_up_button.png" name="1462_EXPOSURE_TI_UP" value=
              "1462_EXPOSURE_TI_UP_BUTTON_WAS_CLICKED" onclick="UpClick()" />
        <input type="image" src="http://findicons.com/files/icons/2332/super_mono/64/navigation_down_button.png" name="1462_EXPOSURE_TI_DOWN" value="" onclick="DownClick()" />

这里有一个简短的例子:

localStorage['StoredClicks'] = Clicks

这将保存现有的Clicks变量为localStorage,在一个名为StoredClicks的键下。

然后,读取这个值,你可以像这样:

var Clicks = localStorage['StoredClicks']

. .希望这对你有帮助!

EDIT:正如Kopax Jack Herrauer所指出的,localStorage将所有数据序列化为一个String,所以当读回整数值时,您应该确保将其解析为整数。我上面的"回读"例子应该是:var Clicks = parseInt(localStorage['StoredClicks'], 10)