验证失败时不会关闭警报消息答案

【问题标题】：alert message not closing when validation fails验证失败时不会关闭警报消息
【发布时间】：2022-12-07 10:54:41
【问题描述】：

不知道我在这里做错了什么。验证失败时警报消息永远不会关闭

<!DOCTYPE html>
<html>
<head>
<script>

function checkNumber(numField) {
    var num = numField.value;
    if(num < 1) {
        getMessage();
        numField.focus();
    return false;
    }
    return true;
}

function getMessage(numField) {
    alert("Not a valid number. Accepts only postive numbers between ");
}

function setTabOut() {
  document.forms[0].elements['taboutFlag'].value = "true";
}

 
</script>
</head>
<body>

<form>
    <p id="demo"></p>

    <input type="text" name="username" onblur="setTabOut();return checkNumber(this);" />

    <INPUT type="hidden" name="taboutFlag" />
</form>
</body>
</html>

【问题讨论】：

标签： javascript html

【解决方案1】：

您遇到此问题是因为在调用 getMessage 并显示警报后，您立即将注意力集中在输入上。当您关闭警报时，您将失去对输入的关注再次，所以 blur 事件被触发，因此无限循环。

要解决这个问题，请不要在调用getMessage 后专注于输入。

<!DOCTYPE html>
<html>

<head>
  <script>
    function checkNumber(numField) {
      var num = numField.value;
      if (num < 1) {
        getMessage();
        return false;
      }
      return true;
    }

    let shownAlert = false;

    function getMessage(numField) {
        alert("Not a valid number. Accepts only postive numbers between ");
    }

    function setTabOut() {
      document.forms[0].elements['taboutFlag'].value = "true";
    }
  </script>
</head>

<body>

  <form>
    <p id="demo"></p>

    <input type="text" name="username" onblur="setTabOut();return checkNumber(this);" />

    <INPUT type="hidden" name="taboutFlag" />
  </form>
</body>

</html>

【讨论】：