有人能帮我理解为什么这个JavaScript代码赢得'不起作用，以及我如何解决它

Can somebody help me understand why this JavaScript code won't work, and how I can fix it?

本文关键字：不起作用 解决 何解决 为什么 代码 JavaScript      更新时间：2023-09-26

我正在尝试为一个项目创建一个全局积分库，我一直在尝试获得我所需要的基本原型。

我问了一个关于如何保存变量的问题，我得到了一个可以的答案，然而，它似乎不起作用，如果我只问一个新问题，而不是花大量时间在评论中与一个人交谈，那可能会更好。

我的问题是，当我按下按钮时，它不会更新。

代码：

<!DOCTYPE HTML>
<html>
    <head>
        <title>Javascript variable testing</title>
    </head>
    <body>
        <script type="tex/javascript">
var clicks = 500000;
function onClick() {
  clicks += 1;
  localStorage.setItem('clicks', clicks); // update the value
  document.getElementById("clicks").innerHTML = clicks;
  localStorage.setItem('clicks', clicks); // set the value to localStorage
};
window.onload = function() {
  clicks = localStorage.getItem('clicks'); // get the value from localStorage
};
        </script>
        <button type="button" onclick="onClick()">Click this bit</button>
            <p>Clicks: <a id="clicks">500000</a>
            </p>
    </body>
</html>

此外，如果有人能制作他们的代码，使变量保持不变，即使对于使用不同计算机的人来说，也将不胜感激。

您在脚本类型中拼写错误。更正为：<script type="text/javascript">

参考你的评论，我会这样做：

<script type="text/javascript">
    var clicks; // variable initialization
    function onClick() {
      clicks = +clicks + 1; // + operator casts value to number
      document.getElementById("clicks").innerHTML = clicks;
      localStorage.setItem('clicks', clicks); // set the value to localStorage
    };
    window.onload = function() {
      clicks = localStorage.getItem('clicks') || 500000; // get the value from localStorage, otherwise (if is null) set 500000 clicks
      document.getElementById("clicks").innerHTML = clicks;
    };
</script>

您忘记了一个t，

 <script type="text/javascript">

在那之后似乎还在工作。

  1. 将tex/javascript更改为text/javascript
  2. 您必须parseInt()本地存储中的值（否则它是一个字符串）
<!DOCTYPE HTML>
<html>
  <head>
    <title>Javascript variable testing</title>
    <script type="text/javascript">
      var clicks;
      function onClick() {
        clicks += 1;
        localStorage.setItem('clicks', clicks); // update the value
        document.getElementById('clicks').innerHTML = clicks;
      }
      window.onload = function() {
        clicks = parseInt(localStorage.getItem('clicks')) || 500000; // get the value from localStorage and parse it to int
        document.getElementById('clicks').innerHTML = clicks;
      };
    </script>
  </head>
  <body>
    <button type="button" onclick="onClick()">Click this bit</button>
    <p>Clicks: <a id="clicks">500000</a>
    </p>
  </body>
</html>

JSFiddle

代码中的小错误，否则一切正常

<!DOCTYPE HTML>
<html>
<head>
<title>Javascript variable testing</title>
</head>
<body>
<script type="text/javascript"> // Small misspelled
var clicks = 500000;
function onClick() {
  clicks += 1;
  localStorage.setItem('clicks', clicks); // update the value
  document.getElementById("clicks").innerHTML = clicks;
  localStorage.setItem('clicks', clicks); // set the value to localStorage
} // Removed semicolon you added by mistake
window.onload = function() {
  clicks = localStorage.getItem('clicks'); // get the value from localStorage
};
</script>
<button type="button" onclick="onClick()">Click this bit</button>
<p>Clicks: <a id="clicks">500000</a></p>
</body>
</html>
相关文章：