Question

我正在制作一份注册表格，我想检查用户在打字时是否有匹配的密码并给他相应的信息。到目前为止，一切都有效，除了这些事情：

当用户从“确认密码”字段中删除所有内容时，它仍然是给我一个消息“密码不匹配”，而我想给他没有消息或消息说“请确认密码”。
当用户从两个字段中删除所有内容，它会给他一条消息 “密码匹配”，但它根本不应该给他任何消息。

这是我的代码：

$(function () {
   $("#txtNewPassword").keyup(checkPasswordMatch);
   $("#txtConfirmPassword").keyup(checkPasswordMatch);
});


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

    if (password == "" && confirmPassword == ""){
        $("#divCheckPasswordMatch").html("");
        $("#divIsPasswordExist").html("");
    }
    else if (password != "" && confirmPassword == "") {
        $("#divCheckPasswordMatch").html("");
    }

    else if (password == "" && confirmPassword != "")
        $("#divIsPasswordExist").html("Password cannot be empty!");
    else
        $("#divIsPasswordExist").html("");


    if (password != confirmPassword)
    {
        $("#divCheckPasswordMatch").removeClass("registrationFormConfirm");
        $("#divCheckPasswordMatch").addClass("registrationFormAlert");
        $("#divCheckPasswordMatch").html("Passwords do not match!");
    }
    else
    {
        $("#divCheckPasswordMatch").removeClass("registrationFormAlert");
        $("#divCheckPasswordMatch").addClass("registrationFormConfirm");
        $("#divCheckPasswordMatch").html("Passwords match.");
    }
}

请问任何想法？谢谢！

Answer 1

那是因为if (password != confirmPassword)是假的，因为两者都是空的，当你设置var password = $("#txtNewPassword").val();和var confirmPassword = $("#txtConfirmPassword").val();这两者都相等时。在检查值是否为空之后应该添加一个返回值，这样当用户删除文本时，它不会检查第一个检查语句下面的任何内容。

//首先检查

if (password == "" && confirmPassword == ""){
return false;
}

......代码的其余部分

Answer 2

if (password == "" && confirmPassword == ""){
    return false;
}
    ....
    ....

if(confirmPassword != "")
    $("#txtConfirmPassword").html("Please confirm password");

        if (password != confirmPassword)
        {
            $("#divCheckPasswordMatch").removeClass("registrationFormConfirm");
            $("#divCheckPasswordMatch").addClass("registrationFormAlert");
            $("#divCheckPasswordMatch").html("Passwords do not match!");
        }
        else
        {
            $("#divCheckPasswordMatch").removeClass("registrationFormAlert");
            $("#divCheckPasswordMatch").addClass("registrationFormConfirm");
            $("#divCheckPasswordMatch").html("Passwords match.");
        }

 ...
 ...

Answer 3

......
        if (password == "" && confirmPassword == ""){
            $("#divCheckPasswordMatch").html("");
            $("#divIsPasswordExist").html("Password and Confirm Password dosen't exists");
            return;
        }
        else if (password != "" && confirmPassword == "") {
            $("#divCheckPasswordMatch").html("Confirm Password dosent't exists");
            return;
        }
        else if (password == "" && confirmPassword != ""){
            $("#divIsPasswordExist").html("Password cannot be empty!");
            return;
        }
        else{
            $("#divIsPasswordExist").html("");
        }
        if (password != confirmPassword)
        {
            $("#divCheckPasswordMatch").removeClass("registrationFormConfirm");
            $("#divCheckPasswordMatch").addClass("registrationFormAlert");
            $("#divCheckPasswordMatch").html("Passwords do not match!");
        }
        else
        {
            $("#divCheckPasswordMatch").removeClass("registrationFormAlert");
            $("#divCheckPasswordMatch").addClass("registrationFormConfirm");
            $("#divCheckPasswordMatch").html("Passwords match.");
        }
.........

Answer 4

有一种更优雅的方式来做到这一点。将您的条件更改为此

if(password.length > 0 && confirmPassword.length >0) {
    if(password == confirmPassword) {
        //confirmed
    } else {
       // not confirm
    }

} else {
   //not entered
}

当两个字段都为空时，检查密码匹配将返回“密码匹配”

4 个答案: