密码强度应用(js)

 <!-- 密码强度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>

密码强度应用(js),布布扣,bubuko.com

时间: 2024-10-15 15:51:05

密码强度应用(js)的相关文章

密码强度的js插件(完成)

效果如下图: 低: 中: 高: 页面上需要绑定的id如下: <div class="passwordtishi f12"> <font class="c666">安全程度:</font> <span id="strength_L">弱</span><span id="strength_M">中</span><span id="s

jquery实现密码强度检测

jquery实现密码强度验证 jquery实现密码强度验证 JS代码: $('#pass').keyup(function(e) { var strongRegex = new RegExp("^(?=.{8,})(?=.*[A-Z])(?=.*[a-z])(?=.*[0-9])(?=.*\\W).*$", "g"); var mediumRegex = new RegExp("^(?=.{7,})(((?=.*[A-Z])(?=.*[a-z]))|((?

js判断密码强度

html代码: 1 <form name="form1" action=""> 2 密码:<input type="password" size="8" onkeyup="pwStrength(this.value)" onblur="pwStrength(this.value)"> 3 <br> 4 密码强度: 5 <table width=&

js密码强度

<!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> <meta http-equiv="Content-

js动态判断密码强度

// 网上拷贝的代码,效果不太好需要自己调整<!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> <meta htt

js 检验密码强度

html 代码如下: <!DOCTYPE HTML> <html lang="en"> <head> <meta charset="utf-8"/> <title>密码强度</title> <style type="text/css"> #passStrength{height:6px;width:120px;border:1px solid #ccc;paddi

Js判断密码强度并显示提示信息

用javascipt实现的Ajax判断密码强弱的功能,大多数有用户注册功能的网站,都会有这么一个功能,作为WEB程序员,应该会写这种小模块哦,不懂的就看下这个例子,觉得挺简单,当初帮助了不少人学会了密码强度的检测. 表单部分,用来显示密码框和密码强度提示信息: <form name=form1 action="" > 请设置密码:<input type="password" size="10" onKeyUp="pwS

JS 密码强度

////////////////////////////////////////////////////////////////////// //密码检测密码强度 ////////////////////////////////////////////////////////////////////// function checkStrong(sValue) { var modes = 0; //正则表达式验证符合要求的 if (sValue.length < 1) return modes;

JS脚本检查密码强度

<html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>无标题文档</title><script type="text/javascript"> //CharMo