添加正确的值后，验证消息不会消失

我有一个登录页面，我添加了一个验证，只要输入为空，您就无法登录，我希望验证消息在用户输入某些输入时消失。我希望它很清楚。这里是我的代码：添加正确的值后，验证消息不会消失

function Validation() { 
 

 

 
    var x = document.getElementById("username").value; 
 
    var y = document.getElementById("password").value; 
 

 

 
    if (x == "") { 
 

 
    document.getElementById("demo1").innerHTML = "*please write name"; 
 

 
    } else { 
 
    document.getElementById("demo1").innerHTML = ""; 
 
    } 
 

 
    if (y == "") { 
 

 

 
    document.getElementById("demo2").innerHTML = "*please write password"; 
 
    return false; 
 
    } else { 
 
    document.getElementById("demo2").innerHTML = ""; 
 
    } 
 
}

<div id="form-wrapper"> 
 

 
    <label for="username">UserName </label> 
 
    <input type="text" id="username" name="myuser" /><span class="validation" id="demo1"> </span> 
 
    <br/> <br/> 
 
    <label for="password"> Password </label> 
 
    <input type="password" id="password" name="mypassword" /> 
 
    <span class="validation" id="demo2"> </span> 
 
    <br /> 
 

 
    <input type="submit" id="login" value="Log in" onclick="return Validation()" /> <br /> 
 
    <input type="checkbox" checked="checked" /> Remember me 
 

 

 
</div>

来源

2017-08-01 ghadah

那是因为你使用的是上的onClick功能实现它。您还应该在用户名输入的onChange上调用它。 – dev8080

对不起，我不明白，所以我应该添加onChange到按钮或输入？ – ghadah

将其添加到输入。两个都。 – dev8080

您需要用户开始在密码或用户名框中键入要尽快打电话给你Validation()功能。您可以通过onkeyup事件像

<input type="password" id="password" name="mypassword" onkeyup="Validation()" />

function Validation() { 
 
    var x = document.getElementById("username").value; 
 
    var y = document.getElementById("password").value; 
 
    if (x == "") { 
 
    document.getElementById("demo1").innerHTML = "*please write name"; 
 
    } else { 
 
    document.getElementById("demo1").innerHTML = ""; 
 
    } 
 
    if (y == "") { 
 
    document.getElementById("demo2").innerHTML = "*please write password"; 
 
    return false; 
 
    } else { 
 
    document.getElementById("demo2").innerHTML = ""; 
 
    } 
 
}

<div id="form-wrapper"> 
 

 
    <label for="username">UserName </label> 
 
    <input type="text" id="username" name="myuser" onkeyup="Validation()"/><span class="validation" id="demo1"> </span> 
 
    <br/> <br/> 
 
    <label for="password"> Password </label> 
 
    <input type="password" id="password" name="mypassword" onkeyup="Validation()" /> 
 
    <span class="validation" id="demo2"> </span> 
 
    <br /> 
 
    <input type="submit" id="login" value="Log in" onclick="return Validation()" /> <br /> 
 
    <input type="checkbox" checked="checked" /> Remember me 
 
</div>

来源

2017-08-01 11:34:42 Tushar

添加正确的值后，验证消息不会消失

回答

相关问题