stecken in der 2. if-Anweisung Javascript

Question

kann jemand herausfinden, was falsch mit meinem Code ist! Ich möchte eine Passwort-Validierung in der dritten if-Anweisung. aber es scheint, dass ich gerade bei meiner 2. If-Anweisung feststeckte! Ich bin seit Stunden dabei .. weiß nicht, was schief gelaufen ist! help PLS! und nebenbei im onkeyup event.

function validateTextbox() { 
    var user = document.getElementById("username"), 
    pass = document.getElementById('password'), 
    cpass = document.getElementById('cpassword'), 
    message = document.getElementById('confirmMessage'), 
    goodColor = "#66cc66", 
    badColor = "#ff6666"; 

    //(first if statement) if its false its gonna output 
    //Username must be 6 characters if true its gonna 
    //proceed to 2nd statement 
    if (user.value.length >= 6) { 
     //(2nd if statement) if its false its gonna output 
     //password must be 8 characters if true its gonna 
     //proceed to 3rd statement 
     if(pass.value.length >= 8){ 
      //And it does not validate password matched 
      //I dont know what went wrong 
      if (pass.value == cpass.value) { 
       cpass.style.backgroundColor = badColor; 
       message.style.color = goodColor; 
       message.innerHTML = "Passwords match" 
      } else { 
       cpass.style.backgroundColor = goodColor; 
       message.style.color = badColor; 
       message.innerHTML = "Passwords does not match!" 
      } 
     } else { 
      pass.style.backgroundColor = badColor; 
      message.style.color = badColor; 
      message.innerHTML = "Password must be 8 characters" 
     } 
    } else { 
     user.style.backgroundColor = badColor; 
     message.style.color = badColor; 
     message.innerHTML = "Username must be 6 characters" 
    } 
} 

Answer 1

Das folgende Code-Beispiel erfüllt genau das, was Sie erklärt haben. Kopieren Sie es und fügen Sie es in eine neue, neue HTML-Datei ein und testen Sie es dann, um zu sehen, was Sie bekommen. Und nebenbei; es ist nicht so viel anders aus Ihrem eigenen Code, sowieso ....

<script> 
     function validateTextbox(){ 
      var user  = document.getElementById("username"); 
      var pass  = document.getElementById('password'); 
      var cpass  = document.getElementById('cpassword'); 
      var message  = document.getElementById('confirmMessage'); 
      var goodColor = "#66cc66"; 
      var badColor = "#ff6666"; 

      //(first if statement) if its false its gonna output 
      //Username must be 6 characters if true its gonna 
      //proceed to 2nd statement 
      if(user.value.length >= 6){ 
       //(2nd if statement) if its false its gonna output 
       //password must be 8 characters if true its gonna 
       //proceed to 3rd statement 

       if(pass.value.length >= 8){ 
        //And it does not validate password matched 
        //I dont know what went wrong 
        if(pass.value == cpass.value){ 
         cpass.style.backgroundColor = badColor; 
         message.style.color   = goodColor; 
         message.innerHTML   = "Passwords match" 
        }else{ 
         cpass.style.backgroundColor = goodColor; 
         message.style.color   = badColor; 
         message.innerHTML   = "Passwords does not match!" 
        } 
       }else{ 
        pass.style.backgroundColor  = badColor; 
        message.style.color    = badColor; 
        message.innerHTML    = "Password must be 8 characters" 
       } 
      }else{ 
       user.style.backgroundColor   = badColor; 
       message.style.color     = badColor; 
       message.innerHTML     = "Username must be 6 characters" 
      } 
      return false; 
     } 
    </script> 


    <form method="post" onsubmit="return validateTextbox();"> 
     <div id="confirmMessage"></div> 
     <input type="text"  id="username" name="username" /> <br /> 
     <input type="password" id="password" name="password" /> <br /> 
     <input type="password" id="cpassword" name="cpassword" /> <br /> 
     <input type="submit" value="Register" /> 
    </form> 

Testen Sie HERE