使用javascript對密碼進行有密碼強度提示的驗證

好些網站的注冊功能中，都有對密碼進行驗證並且還有強度提示。下面就來實現這種效果。
密碼強度說明：
密碼強度：弱——純數字，純字母，純符號
密碼強度：中——數字，字母，符號任意兩種的組合
密碼強度：強——數字，字母，符號全部都要有
實現思路：
在輸入框提示區域編寫兩個div層，一個顯示提示文字，一個顯示密碼強度提示。
給文本框添加onkeyup的驗證事件：
1.沒有輸入時，顯示“密碼可由字母、數字、特殊符號組成，長度為6-18個字符”；
2.光標聚焦到文本框中，在密碼長度沒有6位之前，顯示“密碼不少於6位”提示文字；
3.當文本框中的字符達到6位后，顯示提示文字的層隱藏，顯示密碼強度的層顯示出來；
4.通過正則表達式控制密碼強度提示的三個span的顯隱，對上面三種情況，只需要對第一種，第三種進行驗證即可，相對來說，這兩個表達式比較好些一點。這兩種驗證后也都剩下任意兩種組合，無需再編寫表達式對第二種驗證。
關鍵代碼如下:
JS代碼:

    var reg1 = /(^\d{6,}$)|(^[a-zA-Z]{6,}$)|(^[^a-zA-Z0-9]{6,}$)/; //數字，字母或符號其中的一種
        var reg7 = /\d*\D*((\d+[a-zA-Z]+[^0-9a-zA-Z]+)|(\d+[^0-9a-zA-Z]+[a-zA-Z]+)|([a-zA-Z]+\d+[^0-9a-zA-Z]+)|([a-zA-Z]+[^0-9a-zA-Z]+\d+)|([^0-9a-zA-Z]+[a-zA-Z]+\d+)|([^0-9a-zA-Z]+\d+[a-zA-Z]+))\d*\D*/; //數字字母字符任意組合
        function check_pwd() {
            var pwd = document.getElementByIdx_x_x_x_x_x("txtPwd").value;
            if (pwd.length < 6) {
                $("#pwdPrompt div:eq(1)").html("密碼長度不能小於6位");
                return false;
            } else {
                $("#pwdPrompt div:eq(1)").css("display", "none");
                $("#pwdPrompt div:eq(0)").css("display", "block");
                if (reg1.test(pwd)) {
                    $("#pwdLength span:eq(0)").css("display", "block");
                    $("#pwdLength span:eq(1)").css("display", "none");
                    $("#pwdLength span:eq(2)").css("display", "none");
                    return true;
                }
                else if (!reg7.test(pwd)) {
                    $("#pwdLength span:eq(0)").css("display", "block");
                    $("#pwdLength span:eq(1)").css("display", "block");
                    $("#pwdLength span:eq(2)").css("display", "none");
                    return true;
                }
                else {
                    $("#pwdLength span:eq(0)").css("display", "block");
                    $("#pwdLength span:eq(1)").css("display", "block");
                    $("#pwdLength span:eq(2)").css("display", "block");
                    return true;
                }
                return true;
            }
        }

Html代碼：

<style type="text/css">
#pwdLength span {
display: none;
float: left;
height: 14px;
width: 51px;
font-size: 12px;
text-align: center;
line-height: 14px;
color: white;
border-right: 1px solid white;
}
</style>
<input id="txtPwd" onkeyup="return check_pwd()" type="password" /><br />
<div id="pwdPrompt">
     <div id="pwdLength">
          <span style=" background-color:#999;">弱</span>
          <span style=" background-color:#666;">中</span>
          <span style=" background-color:#333;">強</span>
     </div>
     <div style="width: 340px;">密碼可由字母、數字、特殊符號組成，長度為6-18個字符</div>
</div>