zoukankan      html  css  js  c++  java
  • javascript 检测密码强度

    <!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 runat="server">
        <title></title>
        <script type="text/javascript">
            //CharMode函数
            //测试某个字符是属于哪一类.
            function CharMode(iN) {
                if (iN >= 48 && iN <= 57) //数字
                    return 1;
                if (iN >= 65 && iN <= 90) //大写字母
                    return 2;
                if (iN >= 97 && iN <= 122) //小写
                    return 4;
                else
                    return 8; //特殊字符
            }
    
            //bitTotal函数
            //计算出当前密码当中一共有多少种模式
            function bitTotal(num) {
                modes = 0;
                for (i = 0; i < 4; i++) {
                    if (num & 1) modes++;
                    num >>>= 1;
                }
                return modes;
            }
    
            //checkStrong函数
            //返回密码的强度级别
    
            function checkStrong(sPW) {
                if (sPW.length <= 4)
                    return 0; //密码太短
                Modes = 0;
                for (i = 0; i < sPW.length; i++) {
                    //测试每一个字符的类别并统计一共有多少种模式.
                    Modes |= CharMode(sPW.charCodeAt(i));
                }
    
                return bitTotal(Modes);
    
            }
    
            //pwStrength函数
            //当用户放开键盘或密码输入框失去焦点时,根据不同的级别显示不同的颜色
    
            function pwStrength(pwd) {
                O_color = "#eeeeee";
                L_color = "#FF0000";
                M_color = "#FF9900";
                H_color = "#33CC00";
                if (pwd == null || pwd == '') {
                    Lcolor = Mcolor = Hcolor = O_color;
                }
                else {
                    S_level = checkStrong(pwd);
                    switch (S_level) {
                        case 0:
                            document.getElementById("msg").innerHTML='?';
                            Lcolor = Mcolor = Hcolor = O_color;
                        case 1:
                            Lcolor = L_color;
                            Mcolor = Hcolor = O_color;
                            document.getElementById("msg").innerHTML='Weak';
                            break;
                        case 2:
                            Lcolor = Mcolor = M_color;
                            Hcolor = O_color;
                            document.getElementById("msg").innerHTML='Normal';
                            break;
                        default:
                            document.getElementById("msg").innerHTML='Strong';
                            Lcolor = Mcolor = Hcolor = H_color;
                    }
                }
    
                document.getElementById("strength_L").style.background = Lcolor;
                document.getElementById("strength_M").style.background = Mcolor;
                document.getElementById("strength_H").style.background = Hcolor;
                return;
            }
        </script>
    </head>
    <body>
        <form name="form1" action="">
        输入密码:<input type="password" size="10" onkeyup="pwStrength(this.value)" onblur="pwStrength(this.value)">
        <br>
        密码强度:
        <table width="217" border="1" cellspacing="0" cellpadding="1" bordercolor="#cccccc"
            height="23" style='display: inline'>
            <tr align="center" bgcolor="#eeeeee">
                <td width="33%" id="strength_L"></td>
                <td width="33%" id="strength_M"></td>
                <td width="33%" id="strength_H"></td>
            </tr>
        </table>
        </form>
        <div id="msg"></div>
    </body>
    </html>
  • 相关阅读:
    gulp-rev + gulp-rev-collector解决前端缓存
    NSIS ERROR解决方法
    tortoiseGit教程(常用图文教程)
    Several ports (8005, 8080, 8009) required by Tomcat v7.0 Server at localhost are already in use.解决办法
    Windows之——pid为4的system进程占用80端口的解决办法
    小程序直播开发
    微信小程序直播接入指南
    解决网易云因版权无法生成外链歌单
    小程序之点击下载图片到本地
    PS 有哪些小技巧让你好用到哭?
  • 原文地址:https://www.cnblogs.com/cart55free99/p/3521186.html
Copyright © 2011-2022 走看看