密碼強度應用(js)

標籤：des   class   blog   java   ext   get   

 <!-- 密碼強度div --><div id="tips" class="help-block">　　<b class="fl">密碼強度：</b><span></span><span></span><span></span></div>
<script type="text/javascript">
        $(function(){
            //開始的時候隱藏
                $(‘#tips‘).hide();
        });
    
    //驗證密碼強度
            window.onload = function() {
                //var oTips = document.getElementById("tips");
                var oTips = $(‘#tips‘).get(0);
                //var oInput = document.getElementsByTagName("input")[0];
                var oInput = $(‘#password‘).get(0);
                var aSpan = oTips.getElementsByTagName("span");
                //var aSpan = $("#tips span");
                //alert(aSpan);
                var aStr = ["弱", "中", "強", "非常好"];
                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 = "";
                        
                    if(index==3){
                        index && (aSpan[index - 1].className = "active", aSpan[index - 1].innerHTML = aStr[index - 1]);
                        index && (aSpan[index - 2].className = "active", aSpan[index - 2].innerHTML = aStr[index - 2]);
                        index && (aSpan[index - 3].className = "active", aSpan[index - 3].innerHTML = aStr[index - 3]);
                    }else if(index==2){
                        index && (aSpan[index - 1].className = "active", aSpan[index - 1].innerHTML = aStr[index - 1]);
                        index && (aSpan[index - 2].className = "active", aSpan[index - 2].innerHTML = aStr[index - 2]);
                    }else if(index==1){
                        index && (aSpan[index - 1].className = "active", aSpan[index - 1].innerHTML = aStr[index - 1]);
                    }
                    
                    if($(‘#tips‘).parent().parent().hasClass(‘error‘)){
                        $(‘#tips‘).hide();
                    }else if($(‘#password‘).val().length>=6){
                        $(‘#tips‘).show();
                    }
                        
                };
            };
            /** 強度規則
             + ------------------------------------------------------- +
             1) 任何少於6個字元的組合，弱；任何字元數的同類字元組合，弱；
             2) 任何字元數的兩類字元組合，中；
             3) 12位字元數以下的三類或四類字元組合，強；
             4) 12位字元數以上的三類或四類字元組合，非常好。
             + ------------------------------------------------------- +
             **/
            //檢測密碼強度
            function checkStrong(sValue) {
                var modes = 0;
                if (sValue.length < 6)
                    return modes;
                
                //數字
                if (/\d/.test(sValue))
                    modes++;

                //字母
                if(/[a-zA-Z]/.test(sValue))
                    modes++;
                
                //特殊字元
                if (/\W/.test(sValue))
                    modes++;
                
                switch (modes) {
                    case 1:
                        return 1;
                        break;
                    case 2:
                        return 2;
                        break;
                    case 3:
                        return 3;
                        break;
                }
            }
        </script>