Asp.Net 密码强度显示

来源:互联网 发布:手机淘宝应用授权管理 编辑:程序博客网 时间:2024/04/27 13:46

我在网上看了很多的案例,综合来看还是自己整理后的比较简单点,呵呵

1,js脚本

<head>

<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="#e0f0ff";   
        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:   
                Lcolor=Mcolor=Hcolor=O_color;   
                case 1:   
                Lcolor=L_color;   
                Mcolor=Hcolor=O_color;   
                break;   
                case 2:   
                Lcolor=Mcolor=M_color;   
                Hcolor=O_color;   
                break;   
                default:   
                  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>

 

2,页面

   <tr>
                <td id="Td1" align="right">
                    用密码:
                </td>
                <td>
                    <asp:TextBox ID="txt_Pwd" runat="server" TextMode="Password" Width="120" onKeyUp="pwStrength(this.value)"
                        onBlur="pwStrength(this.value)"></asp:TextBox>
                    <asp:RequiredFieldValidator ID="RequiredFieldValidator3" runat="server" ErrorMessage="*"
                        ControlToValidate="txt_Pwd" ValidationGroup="check"></asp:RequiredFieldValidator>
                    <table border="1" cellpadding="1" bordercolordark="#fdfeff" bordercolorlight="#99ccff" cellspacing="1" style="width: 200px;display: inline; background-color: #e0f0ff;">
                        <tr>
                            <td id="strength_L" style="width: 100px; height: 19px;" align="center">
                                 弱
                            </td>
                            <td id="strength_M" style="width: 100px; height: 19px;" align="center">
                                 中
                            </td>
                            <td id="strength_H" style="width: 100px; height: 19px;" align="center">
                                 强
                            </td>
                        </tr>
                    </table>
                </td>
            </tr>

原创粉丝点击