Body
<Body> <input id = "TXT" type = "text" name = "name" value = "" style = "width: 300px; Border: 1px solid gray; "/> <Table id =" TB "style =" width: 300px; text-align: center; Background-color: # e6e6e6; "> <tr> <TD> weak </TD> <TD> moderate </TD> <TD> strong </TD> </tr> </table> </body>
View code
<SCRIPT> label
<SCRIPT type = "text/JavaScript"> window. onload = function () {document. getelementbyid ('txt '). onkeyup = function () {var TDS = document. getelementbyid ('tb '). getelementsbytagname ('td '); For (VAR I = 0; I <TDs. length; I ++) {TDS [I]. style. backgroundcolor = '# e6e6e6';} // obtain the password var pwdtxt = This. value; // call method if (pwdtxt. length> 0) {var num = checkpwd (pwdtxt); If (Num <= 1) {TDS [0]. style. backgroundcolor = 'green';} else if (num = 2) {TDS [0]. style. backgroundcolor = 'red'; TDS [1]. style. backgroundcolor = 'red';} else if (num = 3) {TDS [0]. style. backgroundcolor = 'blue'; TDS [1]. style. backgroundcolor = 'Blue '; TDS [2]. style. backgroundcolor = 'Blue ';}/// judgment level };}; // judge the password level function checkpwd (PWD) {var LVL = 0; // If (PWD. match (/\ D/) {// determines whether the number LVL ++;} If (PWD. match (/[A-Za-Z]/) {LVL ++;} If (PWD. match (/[^ 0-9a-za-z]/) {LVL ++;} If (PWD. length <= 6) {LVL --;} return LVL ;}</SCRIPT>View code
Effect
Password Strength exercises