Проверка совпадения паролей «совпадение паролей», когда оба поля пустые

Question

Я делаю регистрационную форму, и я хочу проверить, имеет ли пользователь соответствующие пароли во время ввода и дает ему соответствующее сообщение. До сих пор все работает, для этих вещей, за исключением:

• Когда пользователь удаляет все из Confirm поля пароля все еще дает ему сообщение «Пароли не совпадают», а я хочу, чтобы дать ему никакого сообщения или сообщение говоря «Пожалуйста, подтвердите пароль».
• Когда пользователь удаляет все из обоих полей, он дает ему сообщение «Совпадения паролей», в то время как он не должен давать ему никакого сообщения.

Вот мой код:

$(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 == ""){ 
      $("#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 2

Это потому, что if (password != confirmPassword) является ложным, потому что оба пустые в любом случае, когда вы устанавливаете var password = $("#txtNewPassword").val(); и var confirmPassword = $("#txtConfirmPassword").val();, эти оба равны друг другу. Вы должны добавить возврат после проверки, являются ли значения пустыми, так что, когда пользователь удалит текст, он не будет проверять что-либо ниже первой проверки.

// первая проверка

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

... остальной код

Answer 3

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 4

Существует более элегантный способ сделать это. Измените свои условия на это

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

} else { 
    //not entered 
}