Validation du mot de passe en Javascript

Dans ce tutoriel nous allons découvrir comment valider le mot de passe en Javascript. Un mot de passe est correct s’il contient:

  • Au moins 1 caractère majuscule.
  • Au moins 1 caractère minuscule.
  • Au moins 1 chiffre.
  • Au moins 1 caractère spécial.
  • Minimum 10 caractères.

 
 

Script pour valider le mot de passe en Javascript/HTML
Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
function validate() {
var msg;
var str = document.getElementById("mdp").value;
if (str.match( /[0-9]/g) &&
str.match( /[A-Z]/g) &&
str.match(/[a-z]/g) &&
str.match( /[^a-zA-Z\d]/g) &&
str.length >= 10)
msg = "<p style='color:green'>Mot de passe fort.</p>";
else
msg = "<p style='color:red'>Mot de passe faible.</p>";
document.getElementById("msg").innerHTML= msg;
}
</script>
</head>
<body>
Entrez le mot de passe: <input id="mdp" />
<button onclick="validate()">Valider</button><br>
<span id="msg"></span>
</body>
</html>
<!DOCTYPE html> <html> <head> <script type="text/javascript"> function validate() { var msg; var str = document.getElementById("mdp").value; if (str.match( /[0-9]/g) && str.match( /[A-Z]/g) && str.match(/[a-z]/g) && str.match( /[^a-zA-Z\d]/g) && str.length >= 10) msg = "<p style='color:green'>Mot de passe fort.</p>"; else msg = "<p style='color:red'>Mot de passe faible.</p>"; document.getElementById("msg").innerHTML= msg; } </script> </head> <body> Entrez le mot de passe: <input id="mdp" /> <button onclick="validate()">Valider</button><br> <span id="msg"></span> </body> </html>
<!DOCTYPE html> 
<html> 
<head> 
    <script type="text/javascript"> 
        function validate() { 
            var msg; 
            var str = document.getElementById("mdp").value; 
            if (str.match( /[0-9]/g) && 
                    str.match( /[A-Z]/g) && 
                    str.match(/[a-z]/g) && 
                    str.match( /[^a-zA-Z\d]/g) &&
                    str.length >= 10) 
                msg = "<p style='color:green'>Mot de passe fort.</p>"; 
            else 
                msg = "<p style='color:red'>Mot de passe faible.</p>"; 
            document.getElementById("msg").innerHTML= msg; 
        } 
    </script> 
</head> 
<body> 
    Entrez le mot de passe: <input id="mdp" /> 
    <button onclick="validate()">Valider</button><br>
    <span id="msg"></span> 
</body> 
</html>
Résultat
Entrez le mot de passe:
QCM Javascript

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *