Оператор Javascript AND (&&) не работает внутри блока if

У меня есть блок проверки логина JavaScript, однако мой if Блок частично работает, т. е. условие после того, как AND(&&) не проверяется, в результате чего проверка пароля не применяется, вот мой фрагмент кода.

function validateLogin(){
    var userid = document.getElementById('user_id');
    var passid = document.getElementById('pass_id');

    if((userid.value.length < 3) && (passid.value.length < 6)) {
        document.getElementById('user_error').setAttribute("style","color:red")
        document.getElementById('user_error').innerHTML="invalid username/password.";
        return false;
    }
    return true;
}
<form id="login_form" name="login" onsubmit=" return validateLogin()" >
<div>
     <input class="user_login_form" id='user_id' type="text"  required tabindex="1"  name="user_id" autofocus autocomplete=off  placeholder ="User Name">
</div>
<div>
    <input class="user_login_form" id='pass_id' required type="password" tabindex="2"  name="user_pass" placeholder ="Password">
    <p id ="user_error"></p>
</div>
<input class="user_login_submit" type="submit" id='btnLogin' tabindex="3" name="login_btnSubmit" value="LOGIN" >

Источник

2 ответа

Решение

Это оптимизация if, Если первая часть ложна, то дальнейшие сравнения не выполняются из-за false && Anything результаты в false

Вам нужно сравнить, используя OR

function validateLogin() {
  var userid = document.getElementById('user_id');
  var passid = document.getElementById('pass_id');
  if ((userid.value.length < 3) || (passid.value.length < 6)) {
    document.getElementById('user_error').setAttribute("style", "color:red")
    document.getElementById('user_error').innerHTML = "invalid username/password.";
    return false;
  }
  return true;
}
<form id="login_form" name="login" onsubmit=" return validateLogin()">
  <div>
    <input class="user_login_form" id='user_id' type="text" required tabindex="1" name="user_id" autofocus autocomplete=off placeholder="User Name">

  </div>
  <div>
    <input class="user_login_form" id='pass_id' required type="password" tabindex="2" name="user_pass" placeholder="Password">
    <p id="user_error"></p>
  </div>
  <input class="user_login_submit" type="submit" id='btnLogin' tabindex="3" name="login_btnSubmit" value="LOGIN">

Источник

Вы хотите использовать ИЛИ здесь. Так что вы выбросите свою ошибку, если длина имени пользователя меньше 3 ИЛИ длина пассива меньше 6.

if((userid.value.length < 3) || (passid.value.length < 6))

Источник
Другие вопросы по тегам