Javascript AND (&&) 运算符在 if 块内部不起作用答案

【问题标题】：Javascript AND (&&) operator is not working inside if blockJavascript AND (&&) 运算符在 if 块内部不起作用
【发布时间】：2017-10-12 10:45:50
【问题描述】：

我有一个 JavaScript 登录验证块，但是我的 if 块部分工作，即未检查 AND(&&) 后的条件导致未对密码应用验证，这是我的代码 sn-p。

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" >

【问题讨论】：

userid.value.length >3
大声说出你的情况，并将其与你所写的进行比较。

标签： javascript and-operator

【解决方案1】：

是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">

【讨论】：

即使我的 user_id 条件设置为 true，即 user_id 大于 3，它也不起作用，但它仍然不检查 pass_id
@Prasad_Joshi 它绝对可以在上面的 sn-p 中工作，你混淆了 AND 和 OR。
您的代码正在运行，我在上面询问何时使用 AND。
@Prasad_Joshi 使用 AND 时，您的两个条件都必须为真（意味着电子邮件和通行证必须同时无效）。如果其中一个不正确（例如电子邮件正确，但密码不正确），那么您不要进入“如果”。对于 OR：电子邮件或密码必须太短才能执行“if”

【解决方案2】：

您想在此处使用 OR。因此，如果 userid 长度小于 3 或 passid 长度小于 6，您会抛出错误。

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

【讨论】：