Tip: you can modify some code before running
<!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>Javascript user password strength detection</title><meta http-equiv="content-type" content="text/html;charset=gb2312"><!--把下面代码加到<head>与</head>之间--><style type="text/css">Body {font: 12px/1.5 Arial;} input {float: left; font-size: 12px; width: 150px; font-family: arial; border: 1px solid # ccc; padding: 3px;} input. correct {border: 1px solid green;} input. error {border: 1px solid red ;}# tips {float: left; margin: 2px 0 0 20px ;}# tips span {float: left; width: 50px; height: 20px; color: # fff; overflow: hidden; background: # ccc; margin-right: 2px; line-height: 20px; text-align: center;} # tips. s1. active {background: # f30 ;}# tips. s2. active {background: # fc0 ;}# tips. s3. active {background: # cc0 ;}# tips. s4. active {background: #090 ;}</style><script type="text/javascript">Window. onload = function () {var oTips = document. getElementById ("tips"); var oInput = document. getElementsByTagName ("input") [0]; var aSpan = oTips. getElementsByTagName ("span"); var aStr = ["weak", "medium", "strong", "very good"]; var I = 0; oInput. onkeyup = oInput. onfocus = oInput. onblur = function () {var index = checkStrong (this. value); this. className = index? "Correct": "error"; oTips. className = "s" + index; for (I = 0; I <aSpan. length; I ++) aSpan [I]. className = aSpan [I]. innerHTML = ""; index & (aSpan [index-1]. className = "active", aSpan [index-1]. innerHTML = aStr [index-1]) };/** intensity rule + --------------------------------------------------------- + 1) any combination of less than 6 characters, weak; similar character combination of any number of characters, weak; 2) combination of two types of characters in any number; 3) combination of three or four types of characters below 12 characters; 4) A combination of three or four types of characters with more than 12 characters is very good. + ----------------------------------------------------- + ** // Function checkStrong (sValue) {var modes = 0; if (sValue. length <6) return modes; if (/d /. test (sValue) modes ++; // number if (/[a-z]/. test (sValue) modes ++; // Lower case if (/[A-Z]/. test (sValue) modes ++; // uppercase if (/W /. test (sValue) modes ++; // special character switch (modes) {case 1: return 1; break; case 2: return 2; case 3: case 4: return sValue. length <12? 3: 4 break ;}}</script></head><body><!--把下面代码加到<body>与</body>之间--><input type="password" value="" maxlength="16"><div id="tips"></div></body></html>
Tip: you can modify some code before running
