Question

每次单击提交按钮，我都希望体验增加1.我已将体验声明为全局变量，但体验不会超过2。

<html>
<head>
<script>
var Experience = 1;
function scenario1()
{ window.Experience = window.Experience + 1 ;
    alert(window.Experience);

}
</script>
</head>
<body>
<form>
<input type="submit" onclick="scenario1()">
</form>
</body>
</html>

Answer 1

打开开发人员工具并观看网络标签。

单击提交按钮时，它将：

运行您的功能。
重新加载页面
- 重置变量。

您需要阻止该网页提交。

有两种方法。

方法1：阻止提交

<html>
  <head>
    <script>
      var Experience = 1;
      function scenario1() {
        // Shorthand way to write it
        window.Experience++;
        alert(window.Experience);
      }
    </script>
  </head>
  <body>
  <form>
    <input type="submit" onclick="scenario1(); return false">
   </form>
  </body>
</html>

方法2：使用不提交的按钮

<html>
  <head>
    <script>
      var Experience = 1;
      function scenario1() {
        // Shorthand way to write it
        window.Experience++;
        alert(window.Experience);
      }
    </script>
  </head>
  <body>
  <form>
    <button type="button" onclick="scenario1()">Do it</button>
   </form>
  </body>
</html>

额外备注

许多全局变量通常是一个非常糟糕的主意。如果这是针对某种类型的游戏，那么最好将所有内容放入player对象中。

var player = {
  experience: 0,
  name: "Just some guy"
};

// Grant experience
player.experience += 10;

Answer 2

而不是

<input type="submit" onclick="scenario1()">

试试这个：

<input type="button" value="click!" onclick="scenario1()">

这样您的浏览器就不会尝试发布内容并发现错误。

Answer 3

这实际上没有任何问题。它工作正常，你只需要不使用提交按钮。尝试使用常规输入按钮：see here

<input type="button" onclick="scenario1()" value="Submit">

Javascript全局变量不增加

3 个答案: