javascript - 以某种方式显示错误

标签 javascript html

     <!DOCTYPE html>
        <html>
          <body>
            <div class="needContent">
              <label for="Password">Password</label>
              <span class="red-star">&lowast;</span>
              <input type="password" name="Password" id="Password" required="required" onkeyup="starShow()" pattern="^(?=.*\[a-z\])(?=.*\[A-Z\])(?=.*\d)\[a-zA-Z\d\]{8,}$" onchange="check()">
            </div>
            <div class="needContent">
              <label for="Retype_Password">Retype Password</label>
              <span class="red-star">&lowast;</span>
              <input type="password" name="Retype_Password" id="Retype_Password" pattern="^(?=.*\[a-z\])(?=.*\[A-Z\])(?=.*\d)\[a-zA-Z\d\]{8,}$" required="required" onkeyup="starShow()" onchange="check()">
              <p id="status"></p>

<div id="phoneNumber" class="needContent">
                    <label for="Phone_Number" >Phone Number</label>
                    <span class="red-star">&lowast;</span>
                    <input type="tel" name="Phone_Number" id="Phone_Number" 
                    required="required" onchange="Error()" placeholder="999-999-9999" 
                    onkeyup="starShow()" >
                    <p id="showEorror"></p>
                </div>
            </div>


            <script>
    function Error() {
        var phn = document.getElementById("Phone_Number").value;
        if(phn[3]!="-" && phn[7] != "-" ) {
            document.getElementById("showEorror").innerHTML="<span>X</span> The area code of phone number 999-999-9999 can't be all zeros.";
        }else if(phn[0] == 0 || phn[1] == 0 && phn[2] == 0){
            document.getElementById("showEorror").innerHTML="<span>X</span> The area code of phone number 999-999-9999 can't be all zeros.";
        } else {
            document.getElementById("showEorrr").style.display = "none";
        }
    }
              function check() {
                var pass1 = document.getElementById("Password").value;
                var pass2 = document.getElementById("Retype_Password").value;

                if (pass1 != "" && pass2 != "") {
                  if (pass1 != pass2) {
                    document.getElementById("status").innerHTML = "<span>X</span> Doesn't Match.";
                  }
                }
              }
            </script>
          </body>
        </html>

enter image description here 所以我正在做我的学校项目,我试图显示与电话相同的错误“不匹配”,但我不知道我做错了什么。我附上了输出的屏幕截图。

最佳答案

正确输入密码后,您没有重置 #status 文本。试试这个:

if (pass1 != "" && pass2 != "") {
  if (pass1 != pass2) {
    document.getElementById("status").innerHTML = "<span>X</span> Doesn't Match.";
  } else document.getElementById("status").textContent = 'ok';
}

对于电话部分,您有一个或两个拼写错误:"showEorror""showEorrr",这再次意味着错误文本不会消失.我建议改用 showErrorshowPhoneError

关于javascript - 以某种方式显示错误,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49826682/

相关文章:

javascript - 单击链接时,在同一 jsp 上异步将 jsp 包含在 div 中

javascript - 如何删除 IE 模态窗口标题中的 "Webpage Dialog"?

javascript - 将表单值附加到操作 url - 动态

javascript - $location.search() 在 Angular 7 中等效

javascript - Javascript 能否以最少的功能实现类似 JSX 的语法?

php - 如何在表格内容中创建 View 控制台

PHP Foreach 语句问题。返回多行

html - CSS隐藏滚动条,但元素可滚动

javascript - 防止从周围激活菜单

jquery - 同步多个 CSS3 动画