Passwort-Validierung in Javascript

Question

Ich muss die Validierung für ein Passwort mit mindestens 8 Zeichen beinhalten ein Sonderzeichen und mindestens einen Großbuchstaben.

Ich habe dieses Skript versucht, wie:

$(document).on('keyup', '.passworduser', function() { 
 
    var txtInput = $(this).val(); 
 
    var regPass = "^(?=.*?[0-9])(?=.*?[A-Z])(?=.*?[#?!@$%^&*-_]).{8,}$"; 
 
    var color = "Red"; 
 
    if (txtInput.length > 7) { 
 
    if (!txtInput.match(regPass)) { 
 
     $('#password_strength').html("Include a special character and at least one capital letter"); 
 
     $("#password_strength").css("color", color); 
 

 
    } else { 
 
     $('#password_strength').html(""); 
 

 
    } 
 
    } else { 
 
    $('#password_strength').html("Password to be a minimum of 8 characters"); 
 
    $("#password_strength").css("color", color); 
 

 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<input type="text" class="passworduser"> 
 
<div id="password_strength"></div>

Aus irgendeinem Ausdruck es funktioniert, für einige ist es nicht der Fall ist.

Answer 1

regPass ist ein String. Es sollte um Backslashes gewickelt werden, um Regex zu erstellen, oder die Zeichenfolge an RegExp-Konstruktor übergeben.

var regPass = /^(?=.*?[0-9])(?=.*?[A-Z])(?=.*?[#?!@$%^&*\-_]).{8,}$/; 

OR

var regPass = new RegExp("^(?=.*?[0-9])(?=.*?[A-Z])(?=.*?[#?!@$%^&*\\-_]).{8,}$"); 

Auch der - (Bindestrich) in Zeichenklasse wird verwendet Zeichenbereich auszuwählen. Um es wörtlich zu kennzeichnen, entkomme es oder verschiebe es an den Anfang oder das Ende der Charakterklasse.

---

Hier vollständiger Code mit einigen Änderungen

// Can be moved outside 
var regex = /^(?=.*?[0-9])(?=.*?[A-Z])(?=.*?[#?!@$%^&*\-_]).{8,}$/; 

$(document).on('keyup', '.passworduser', function() { 
    var value = $(this).val(); 
    var color = "Red"; 

    if (value.length > 7) { 
     // Use RegExp.test instead of String.match 
     if (regex.test(value)) { 
      // Method chaining 
      $('#password_strength').html("Include a special character and at least one capital letter") 
       .css("color", color); 
     } else { 
      $('#password_strength').html(""); 
     } 
    } else { 
     $('#password_strength').html("Password to be a minimum of 8 characters") 
      .css("color", color); 
    } 
}); 

Answer 2

Ihre Regex einfach halten. Es ist einfacher zu debuggen. Versuchen Sie folgendes:

function testPassword(pw) { 
// for all special characters 
var reSpecial = /[#?!@$%^&*\-_\\\/]/; 
// for Capitals 
var reCap = /[A-Z]/; 

// just test both of them... 
return pw.match(reSpecial) != undefined && pw.match(reCap) != undefined; 
}; 

console.log(testPassword("asdf"));// false 
console.log(testPassword("asdf5"));//false 
console.log(testPassword("asdA"));//false 
console.log(testPassword("asdf%"));//false 
console.log(testPassword("asdfA%"));//true 


$(document).on('keyup', '.passworduser', function(){ 
    var color="Red"; 
    if(txtInput.length > 7){ 
    if(!testPassword(txtInput){ 
     $('#password_strength').html("Include a special character and at least one capital letter"); 
     $("#password_strength").css("color", color); 
    }else{ 
    $('#password_strength').html(""); 
    } 
    }else{ 
    $('#password_strength').html("Password to be a minimum of 8 characters");  
    $("#password_strength").css("color", color); 
    } 
}); 

Answer 3

Bitte versuchen Sie dies, ich habe Ihren Code aktualisiert, hier ist der Code unter:

$(document).on('keyup', '.passworduser', function(){ 
    var txtInput = $(this).val(); 
    var color="Red"; 
    var uppercase = /[A-Z]/ ; 
    var lowercase = /[a-z]/ ; 
    var number = /[0-9]/ ; 
    var special = /[\W]{1,}/ ; 
    var pswd_length = txtInput.length < 8; 
    if(!uppercase.test(txtInput) || !lowercase.test(txtInput) || !number.test(txtInput) || !special.test(txtInput) || pswd_length) { 
     $('#password_strength').html('Password must be at least 8 characters. Password must contain at least one upper case letter, one lower case letter and one digit.'); 
     $("#password_strength").css("color", color); 
     //return false; 
    } 
    else { 
     $('#password_strength').html(""); 
    } 

}); 

Ich hoffe, dies für Sie hilfreich sein können.