Question

我有一个按钮，用于检查输入文本以查看它是否是正确的密码。问题是该按钮只能工作一次，当您多次单击时，它不会反复运行该功能。

我的代码：

<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>

Answer 1

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

＆＃13;

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!";
  }
}

＆＃13;

<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>

＆＃13;

Answer 2

您正在初始化＆＃34;尝试＆＃34;每次调用该函数时递减它。因此，似乎该函数只被调用一次。

将变量的减速度移到函数外部。像

这样的东西

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

另一种更好的方法是使用localStorage or sessionStorage甚至使用Cookie。

谢谢，第

onClick按钮只能工作一次

2 个答案: