精美而实用的网站,关注web编程技术、网站运营、SEO推广,让您轻松愉快的学习

今天项目需要判断客户输入的密码强度,规则只数字为弱,数字+字母为中级,判断大小写组合等,下面青岛星网跟大家分享下实现代码。

便于演示只放密码框判断部分,HTML代码如下

<style type="text/css">
#ps1{padding:10px;margin:10px;background:#ccc;cursor:pointer}
#s{border:1px solid #f00;display:inline-block;*display:inline;*zoom:1;padding:1px 10px 1px;font-size:12px;display:none;background:#f2f2f2}
</style>
<div id="sd">
<p><input type="text" id="ps2">
<span id="s"> </span></p>
</div>

JS判断密码强度代码

<script type="text/javascript">
function $(id){return document.getElementById(id);}
  $('ps2').onblur=function()
    {
    var n=0,aaa;
    if (/\d/.test($('ps2').value)) n ++; //包含数字
    if (/[a-z]/.test($('ps2').value)) n ++; //包含小写字母
    if (/[A-Z]/.test($('ps2').value)) n ++; //包含大写字母
    if (/\W/.test($('ps2').value)) n ++; //包含其他字符
    if ($('ps2').value.length< 5) n=0; //长度小于5位
    
    switch(n)
    {
    case 0 :
    aaa=" 密码长度至少6位"; break;
    case 1 :
    aaa=" 初级"; break;
    case 2 :
    aaa=" 中级"; break;
    case 3 :
    aaa=" 高级"; break;
    case 4 :
    aaa=" 安全级"; break;
    }
    $('s').style.cssText='display:inline-block;*display:inline;*zoom:1;';
  $('s').innerHTML=aaa;
  }
</script>

扩展阅读:js判断密码强度的方法代码   JS正则检测密码强度代码

Tags:js正则 密码强度 判断密码