如何在密码值为空时禁用消息

Question

我正在使用密码匹配概念，当我在其中输入密码时它工作正常，它显示＆＃34;密码匹配＆＃34;或＆＃34;密码不匹配＆＃34;。但这是问题还是可以说是虫子的事情。当你的密码匹配，然后突然你删除了两个密码，它仍然显示＆＃34;密码匹配＆＃34;或者＆＃34;密码不匹配＆＃34;。我发布的图片是为了更好地理解。

那么如何隐藏或删除密码不匹配或密码匹配＆＃34;当两个密码在框中都为空时发表评论。我发布下面的代码我做了什么

HTML

<p>
    <input type="password" name="NPassword" placeholder="New Password" id="txtNewPassword" />
</p>
<input type="password" name="RNPassword" placeholder="Retype New Password" id="txtConfirmPassword" onChange="isPasswordMatch();" />
<div id="divCheckPassword"></div>

的JavaScript

function isPasswordMatch() {
    var password = $("#txtNewPassword").val();
    var confirmPassword = $("#txtConfirmPassword").val();

    if (password != confirmPassword) $("#divCheckPassword").html("Passwords do not match!");
    else $("#divCheckPassword").html("Passwords match.");


}

$(document).ready(function () {
    $("#txtConfirmPassword").keyup(isPasswordMatch);
});

Answer 1

添加一项检查以检查密码文本框是否为空或已填写。如果文本框为空，则清除divCheckPassword

Answer 2

您应该添加一个测试来检查密码字段是否为空。

function isPasswordMatch() {
    var password = $("#txtNewPassword").val();
    var confirmPassword = $("#txtConfirmPassword").val();

    if (password != confirmPassword) $("#divCheckPassword").html("Passwords do not match!");
    else if ((password ==  "") || (confirmPassword == "")) $("#divCheckPassword").html("Please fill both password fields"); 
    else $("#divCheckPassword").html("Passwords match.");


}

$(document).ready(function () {
    $("#txtConfirmPassword").keyup(isPasswordMatch);
});

或使用$("#divCheckPassword").html("");代替$("#divCheckPassword").html("Please fill both password fields");来清除讯息。

Answer 3

首先检查input是否为空。

＆＃13;

＆＃13;

function isPasswordMatch() {
    var password = $("#txtNewPassword").val();
    var confirmPassword = $("#txtConfirmPassword").val();

    if(password =='' || confirmPassword=='')
      $("#divCheckPassword").html('');
    else if(password != confirmPassword)
      $("#divCheckPassword").html("Passwords do not match!");
    else
      $("#divCheckPassword").html("Passwords match.");


}

$(document).ready(function () {
    $("#txtConfirmPassword").keyup(isPasswordMatch);
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>
    <input type="password" name="NPassword" placeholder="New Password" id="txtNewPassword" />
</p>
<input type="password" name="RNPassword" placeholder="Retype New Password" id="txtConfirmPassword" onChange="isPasswordMatch();" />
<div id="divCheckPassword"></div>

＆＃13;

＆＃13;

＆＃13;

Answer 4

此代码用于在您首先删除密码并确认密码时隐藏邮件，反之亦然。

＆＃13;

＆＃13;

function isPasswordMatch() {
    var password = $("#txtNewPassword").val();
    var confirmPassword = $("#txtConfirmPassword").val();

    if (password != confirmPassword) $("#divCheckPassword").html("Passwords do not match!");
        else $("#divCheckPassword").html("Passwords match.");

 if ((password ==  "") && (confirmPassword == "")) $("#divCheckPassword").hide();


if ((confirmPassword ==  "") && (password == "")) $("#divCheckPassword").hide();
}

$(document).ready(function () {
    $("#txtNewPassword").keyup(isPasswordMatch);
    $("#txtConfirmPassword").keyup(isPasswordMatch);
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>
    <input type="password" name="NPassword" placeholder="New Password" id="txtNewPassword" />
</p>
<input type="password" name="RNPassword" placeholder="Retype New Password" id="txtConfirmPassword" onChange="isPasswordMatch();" />
<div id="divCheckPassword"></div>

＆＃13;

＆＃13;

＆＃13;