javascript - 清除验证错误 JavaScript

Question

我一直在尝试在用户成功输入完成所需的验证规则后清除消息，但是我似乎无法清除所有验证错误，我确实环顾四周并尝试了建议的内容，但似乎没有工作过。我认为通过放置空的 innerHTML 字符串可能会起作用，正如我在其他帖子中建议的那样

 <form action ="" method="POST">
    <span id="tryErr"></span><br>
    <input type="text" id="username" placeholder="Username"><br>
    <span id="usernameErr"></span><br>
    <input type="text" id="email" placeholder="Email address"><br>
    <span id="emailErr"></span><br>
    <input type="password" id="password" placeholder="Password"><br>
    <span id="passwordErr"></span><br>
    <input type="submit" value="Submit" onclick=" return confirmValidation();">
</form>    

JS

 <script type="text/javascript">      

    function validateUsername(username, error){
        var username = document.getElementById("username").value,
        error = document.getElementById("usernameErr");

       if(username == null || username==""){   
        return error.innerHTML = "Username is required";
        return false;
       }
        else if(!username.match(/^[0-9a-z]+$/) || username.length < 3){
        return error.innerHTML = "Username must be alphanumeric and three characters long";
        return false;
       }
       else{
           return error.innerHTML = "";
           return true;
       }
    }

    function validatePassword(password, error){
        var password = document.getElementById("password").value,
        error = document.getElementById("passwordErr");
       if(password == null || password==""){
        return error.innerHTML = "Password is required";
        return false;
       }
        else if(password.length < 7){
        return error.innerHTML = "Password must be seven characters long";    
        return false;
       }
       else{
           return error.innerHTML = ""; 
           return true;
       }
    }

    function validateEmail(email, error){
        var email = document.getElementById("email").value,
        apos = email.indexOf("@"),
        dotpos = email.lastIndexOf("."),
        error = document.getElementById("emailErr");

        if(email == null || email==""){
        return error.innerHTML = "Email is required";
        return false;
       }
        if (apos < 1  ||  dotpos-apos < 2 || dotpos == (email.length - 1)){
            return error.innerHTML = "Please enter a valid email";
            return false;
        } 
        else{
            return error.innerHTML = "";
            return true;
        }
    }


    function confirmValidation(e){
        event.preventDefault(e);    
        if(!validateUsername()){
            return false;
        }
        if(!validatePassword()){
            return false;
        }
         if(!validateEmail()){
           return false;
        }
        else{
            //do something clever here

        }
    }

    </script>

Answer 1

您应该对输入类型使用 onchange 事件。 喜欢

<input type="text" id="username" placeholder="Username " onchange="validateUsername()">