时间戳

首页 > 解决方案 > 尝试将数据存储在点击器网站中

javascript - 尝试将数据存储在点击器网站中

问题描述

我正在尝试存储一个变量score，无论您何时刷新，您都会一次又一次地使用该变量。我无法弄清楚的是代码是什么。我尝试了一些方法，但它们似乎都不起作用。

这是我的点击器网站。但是当我尝试使用 JavaScript 来存储它时，它不适用于window.onload和onload=. 另外我的负载可能是正确的，因为我有score = data一个document.getElementById('points').innerHTML = score;.

我的代码如下所示：

var score = 0;

setInterval(SaveData, 10);

setInterval(Click, 1000); // Every full second allow clicking ONE point.

function Click() {
  score++;
  document.getElementById('btn').onclick = function() {
    document.getElementById('demo').innerHTML = score;
    clearInterval(Click);
  }
}

function SaveData() {
  // What saves the variable score
  localStorage['save'] = btoa(JSON.stringify(score));
}

function LoadData() {
  score = JSON.parse(atob(localStorage['save']))
  document.getElementById('demo').innerHTML = score;
}

window.onload = function() {
  // When the window loads do this
  LoadData();
};

标签： javascripthtmllocal-storage

解决方案

更改此行SaveData()：

localStorage['save'] = btoa(JSON.stringify(score));

对此：

localStorage.setItem('save', btoa(JSON.stringify(score)));

这行在LoadData()：

score = JSON.parse(atob(localStorage['save']))

对此：

score = JSON.parse(atob(localStorage.getItem('save')));

此外，无需每次点击都更新事件。您可以将该代码移出Click()函数：

document.getElementById('btn').onclick = function() {
  document.getElementById('demo').innerHTML = score;
  clearInterval(Click);
}

function Click() {
  score++;
}

并且您传递给clearInterval()从 中返回的 ID 值setInterval()，而不是函数引用。就像是：

var timer = setInterval(Click, 1000);
clearInterval(timer);

推荐阅读