logo标签列表

单击按钮仅起作用一次

javascripthtmlbuttononclick
3

我有一个按钮，它检查输入的文本是否是正确的密码。问题是，当你点击多次时，按钮只能工作一次，无法重复运行函数。

我的代码：

<html>

<head>
  <title>Password</title>
  <script>
  function passcheck() {
    var attempts = 5;
    var q = document.getElementById('txt').value;
    if (q == "12345") {
      document.getElementById("result").innerHTML = "You're In!";
    } else {
      attempts--;
      document.getElementById("result").innerHTML = "Wrong password, You Have " + attempts + " Tries Left!";
    }
  }
  </script>
</head>

<body>
  <font face="Verdana" size="5"><b>Enter Your Password:</b></font>
  <br/><br/>
  <input id="txt" type="text" onclick="this.select()" style="text-align:center;" width="25">
  <button type="button" onclick="passcheck()">Submit!</button>
  <p id="result"></p>

</body>

</html>
2个回答
1

它被多次调用，但您没有看到任何更改，因为attempts是在函数内定义的。这意味着每次运行该函数时，attempts都会被重置为5。要解决这个问题，将attempts声明移动到函数外部。

var attempts = 5; // Moved to here so we don't reset the value

function passcheck() {
  var q = document.getElementById('txt').value;
  if (q == "12345") {
    document.getElementById("result").innerHTML = "You're In!";
  } else {
    attempts--;
    document.getElementById("result").innerHTML = "Wrong password, You Have " + attempts + " Tries Left!";
  }
}
<font face="Verdana" size="5"><b>Enter Your Password:</b></font>
<br/>
<br/>
<input id="txt" type="text" onclick="this.select()" style="text-align:center;" width="25">
<button type="button" onclick="passcheck()">Submit!</button>
<p id="result"></p>

0

您正在初始化“attempts”的值，并在每次调用函数时将其递减。因此，似乎函数只被调用一次。

将变量的声明移动到函数外部。类似于：

var attempts = 5;
function passcheck() {
  //code here ...
}

另一种稍微更好的方法是利用localStorage或sessionStorage，甚至使用cookies。

谢谢， 帕拉斯

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接