javascript - 试图将数据存储在答题器网站中

Question

我正在尝试存储一个名为 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();
};

Answer 1

在 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++;
}

然后您将您从 setInterval() 返回的 ID 值传递给 clearInterval()，而不是函数引用。像这样的东西:

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