Introduction:
In this article I will explain how to
check password strength. We will use five different ways to check password strength:
1. Password length
2.
Capital Letters
3.
Small letters
4.
Special Characters
5. Numeric Numbers
Following Javascript code will be used to check Password Strength;
<script type="text/javascript">
$(function () {
$("#txtPassword").bind("keyup", function () {
//TextBox left
blank.
if ($(this).val().length == 0)
{
$("#password_strength").html("");
return;
}
//Regular
Expressions.
var regex = new Array();
regex.push("[A-Z]"); //Uppercase Alphabet.
regex.push("[a-z]"); //Lowercase Alphabet.
regex.push("[0-9]"); //Digit.
regex.push("[$@$!%*#?&]"); //Special Character.
var passed = 0;
//Validate for each
Regular Expression.
for (var i = 0; i <
regex.length; i++) {
if (new
RegExp(regex[i]).test($(this).val())) {
passed++;
}
}
//Validate for
length of Password.
if (passed > 2
&& $(this).val().length >
8) {
passed++;
}
//Display status.
var color = "";
var strength = "";
switch (passed) {
case 0:
case 1:
strength = "Weak";
color = "red";
break;
case 2:
strength = "Good";
color = "darkorange";
break;
case 3:
case 4:
strength = "Strong";
color = "green";
break;
case 5:
strength = "Very Strong";
color = "darkgreen";
break;
}
$("#password_strength").html(strength);
$("#password_strength").css("color", color);
});
});
</script>
Full Source Code:
<fieldset style="width:350px"><legend><strong>Check Password
Strength In Javascript</strong></legend>
<div style="background: #f2f2f2;color: White; font-weight:bold;">
<input type="text" id="txtPassword" />
<span id="password_strength"></span>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
$(function () {
$("#txtPassword").bind("keyup", function () {
//TextBox left
blank.
if ($(this).val().length == 0)
{
$("#password_strength").html("");
return;
}
//Regular
Expressions.
var regex = new Array();
regex.push("[A-Z]"); //Uppercase Alphabet.
regex.push("[a-z]"); //Lowercase Alphabet.
regex.push("[0-9]"); //Digit.
regex.push("[$@$!%*#?&]"); //Special Character.
var passed = 0;
//Validate for each
Regular Expression.
for (var i = 0; i <
regex.length; i++) {
if (new
RegExp(regex[i]).test($(this).val())) {
passed++;
}
}
//Validate for
length of Password.
if (passed > 2
&& $(this).val().length >
8) {
passed++;
}
//Display status.
var color = "";
var strength = "";
switch (passed) {
case 0:
case 1:
strength = "Weak";
color = "red";
break;
case 2:
strength = "Good";
color = "darkorange";
break;
case 3:
case 4:
strength = "Strong";
color = "green";
break;
case 5:
strength = "Very Strong";
color = "darkgreen";
break;
}
$("#password_strength").html(strength);
$("#password_strength").css("color", color);
});
});
</script>
</div></fieldset>
0 comments:
Post a Comment