js检测密码强度的代码(附效果图)

使用javascript代码检测密码的强度，效果图如下所示：

1，js代码：

<script>
/**
* js 正则验证密码强度
* by www.jb200.com
*/
function AuthPasswd(string) {
if(string.length >=6) {
if(/[a-zA-Z]+/.test(string) && /[0-9]+/.test(string) && /W+D+/.test(string)) {
noticeAssign(1);
}else if(/[a-zA-Z]+/.test(string) || /[0-9]+/.test(string) || /W+D+/.test(string)) {
if(/[a-zA-Z]+/.test(string) && /[0-9]+/.test(string)) {
noticeAssign(-1);
}else if(/[a-zA-Z]+/.test(string) && /W+D+/.test(string)) {
noticeAssign(-1);
}else if(/[0-9]+/.test(string) && /W+D+/.test(string)) {
noticeAssign(-1);
}else{
noticeAssign(0);
}
}
}else{
noticeAssign(null);
}
}

function noticeAssign(num) {
if(num == 1) {
$('#weak').css({backgroundColor:'#009900'});
$('#middle').css({backgroundColor:'#009900'});
$('#strength').css({backgroundColor:'#009900'});
$('#strength').html('很强');
$('#middle').html('');
$('#weak').html('');
}else if(num == -1){
$('#weak').css({backgroundColor:'#ffcc33'});
$('#middle').css({backgroundColor:'#ffcc33'});
$('#strength').css({backgroundColor:''});
$('#weak').html('');
$('#middle').html('中');
$('#strength').html('');
}else if(num ==0) {
$('#weak').css({backgroundColor:'#dd0000'});
$('#middle').css({backgroundColor:''});
$('#strength').css({backgroundColor:''});
$('#weak').html('弱');
$('#middle').html('');
$('#strength').html('');
}else{
$('#weak').html('&nbsp;');
$('#middle').html('&nbsp;');
$('#strength').html('&nbsp;');
$('#weak').css({backgroundColor:''});
$('#middle').css({backgroundColor:''});
$('#strength').css({backgroundColor:''});
}
}
</script>