您的位置：首页 > Web前端 > JavaScript

JavaScript密码强度检测

2009-07-26 08:40 411 查看

Html代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<title>密码强度检测</title>

<META http-equiv=Content-Type content="text/html; charset=utf-8">

<style type="text/css">

body {font-size:12px}

.pwd-strength-box,

.pwd-strength-box-low,

.pwd-strength-box-med,

.pwd-strength-box-hi

{

color: #464646;

text-align: center;

width: 40px;

}

.pwd-strength-box-low

{

color: #CCCCCC;

background-color: #E0FFA2;

width: 40px;

}

.pwd-strength-box-med

{

color: #666666;

background-color: #D1FF46;

width: 40px;

}

.pwd-strength-box-hi

{

color: #000000;

background-color: #C0F000;

width: 40px;

}

</style>

<script type="text/javascript">

/*

函数名称：trim()

函数功能: 去掉字符串的前后空格

传入参数：字符串变量

传出结果：去掉前后空格后的字符串

*/

function trim(srcStr)

{

var i,j,len;

len=srcStr.length;

for(i=0;i<len;i++)

if(srcStr.charAt(i)!=' ') break;

for(j=len-1;j>=i;j--)

if(srcStr.charAt(j)!=' ') break;

if(i>j)

return "";

else

return srcStr.substr(i,j-i+1);

}

function $(obj)

{

return document.getElementById(obj);

}

//检查密码等级

function checkpwdlevel(pwd)

{

var objLow=document.getElementById("pwdLow");

var objMed=document.getElementById("pwdMed");

var objHi=document.getElementById("pwdHi");

objLow.className="pwd-strength-box";

objMed.className="pwd-strength-box";

objHi.className="pwd-strength-box";

if(pwd.length<6)

{

objLow.className="pwd-strength-box-low";

}

else

{

var p1= (pwd.search(/[a-zA-Z]/)!=-1) ? 1 : 0;

var p2= (pwd.search(/[0-9]/)!=-1) ? 1 : 0;

var p3= (pwd.search(/[^A-Za-z0-9_]/)!=-1) ? 1 : 0;

var pa=p1+p2+p3;

if(pa==1)

{

objLow.className="pwd-strength-box-low";

}

else if(pa==2)

{

objLow.className="pwd-strength-box-low";

objMed.className="pwd-strength-box-med";

}

else if(pa==3)

{

objLow.className="pwd-strength-box-low";

objMed.className="pwd-strength-box-med";

objHi.className="pwd-strength-box-hi";

}

}

}

</script>

</head>

<body>

<table width="100%" border="0" cellspacing="0">

<tr>

<td height="32" align="right" style="width: 83px">

密码：</td>

<td align="left">

<input id="password" type="password" size="18" name="userpwd" runat="server" onkeyup="javascript:checkpwdlevel(this.value);"

class="register_input" /></td>

</tr>

<tr>

<td height="32" align="right" style="width: 83px">

安全性等级：</td>

<td align="left">

<table style="border-left: 1px solid #7CA001; border-top: 1px solid #7CA001; border-right: 1px solid #7CA001;

border-bottom: 1px solid #7CA001;" cellspacing="0" cellpadding="0" width="120px">

<tbody>

<tr>

<td class="pwd-strength-box" id="pwdLow" style="width: 40px; height: 16px" align="center"

valign="bottom">

弱</td>

<td class="pwd-strength-box" id="pwdMed" style="width: 40px; height: 16px" align="center"

valign="bottom">

中</td>

<td class="pwd-strength-box" id="pwdHi" style="width: 40px; height: 16px" align="center"

valign="bottom">

强</td>

</tr>

</tbody>

</table>

</td>

</tr>

</table>

</body>

</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航