以下是代码：

<html>

<head>

<title>JS判断密码强度</title>

<script language=javascript>

    //判断输入密码的类型

    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;

    }

    //返回强度级别

    function checkStrong(sPW){

        if (sPW.length<6)

            return 0; //密码太短，不检测级别

        Modes=0;

        for (i=0;i<sPW.length;i++){

            //密码模式

            Modes|=CharMode(sPW.charCodeAt(i));

        }

        return bitTotal(Modes);

    }

    //显示颜色

    function pwStrength(pwd){

        Dfault_color="#eeeeee";        //默认颜色

        L_color="#FF0000";        //低强度的颜色，且只显示在最左边的单元格中

        M_color="#FF9900";        //中等强度的颜色，且只显示在左边两个单元格中

        H_color="#33CC00";        //高强度的颜色，三个单元格都显示

        if (pwd==null||pwd==''){

            Lcolor=Mcolor=Hcolor=Dfault_color;

        }

        else{

            S_level=checkStrong(pwd);

            switch(S_level) {

            case 0:

                Lcolor=Mcolor=Hcolor=Dfault_color;

                break;

            case 1:

                Lcolor=L_color;

                Mcolor=Hcolor=Dfault_color;

                break;

            case 2:

                Lcolor=Mcolor=M_color;

                Hcolor=Dfault_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>

<body>

<form name=form1 action="" >

    <table width="250" border="0" cellpadding=2" bordercolor="#eeeeee" style='display:inline'>

        <tr>

            <td width="40%" align="right">密码:</td>

            <td colspan="3" align="left">

                <input type=password size=20 onKeyUp=pwStrength(this.value) onBlur=pwStrength(this.value)>

            </td>

        </tr>

        <tr align="center">

            <td width="40%" align="right">密码强度:</td>

            <td width="20%" id="strength_L" bgcolor="#eeeeee">弱</td>

            <td width="20%" id="strength_M" bgcolor="#eeeeee">中</td>

            <td width="20%" id="strength_H" bgcolor="#eeeeee">强</td>

        </tr>

    </table>

</form>

</body>

</html>

JavaScript判断密码强度的更多相关文章

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

    用javascipt实现的Ajax判断密码强弱的功能,大多数有用户注册功能的网站,都会有这么一个功能,作为WEB程序员,应该会写这种小模块哦,不懂的就看下这个例子,觉得挺简单,当初帮助了不少人学会了密 ...

  2. 【课上OJ】判断密码强度

    一个判断密码强度问题: 假设允许采用以下四类字符作为密码: (1)大写英文字母,(2)小写英文字母,(3)数字0-9,(4)特殊符号 @ - _ # ~ 对密码强度做以下规定: Best: 长度> ...

  3. js判断密码强度是否符合

    /** 判断密码强度是否符合 */ function check_passwd_intensity(password) { value = $.trim(password); if( value.le ...

  4. js判断密码强度

    html代码: <form name="form1" action=""> 密码:<input type="password&quo ...

  5. js动态判断密码强度&&实用的 jQuery 代码片段

    // 网上拷贝的代码,效果不太好需要自己调整<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" &q ...

  6. javascript 检测密码强度

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  7. JavaScript验证密码强度

    JavaScript的方法: <script type="text/javascript"> window.onload = function () { documen ...

  8. javascript 检测密码强度 美化版

    模仿美团的美化 <!DOCTYPE> <head runat="server"> <title></title> <link ...

  9. PHP 判断密码强度

                 $score = 0;            if(preg_match("/[0-9]+/",$str))            {           ...

随机推荐

  1. Go 跨域请求问题

    在使用go语言写测试服务的时候遇到了前端跨域请求问题,只需在go中加入 w.Header().Set("Access-Control-Allow-Origin", "*& ...

  2. 20155211 2016-2017-2 《Java程序设计》第四周学习总结

    20155211 2016-2017-2 <Java程序设计>第四周学习总结 教材学习内容总结 这周的内容感觉较上周相比难度增加 教材学习中的问题和解决过程 刚开始学习第六章的时候的时候敲 ...

  3. 20155229 2016-2017-2 《Java程序设计》第四周学习总结

    20155229 2016-2017-2 <Java程序设计>第四周学习总结 教材学习内容总结 第六章: extends:继承某个类,继承之后可以使用父类的方法,也可以重写父类的方法,只要 ...

  4. 20155232 实验一《Java开发环境的熟悉》实验报告

    20155232 实验一<Java开发环境的熟悉>实验报告 实验内容 使用JDK编译.运行简单的Java程序: 使用Eclipse 编辑.编译.运行.调试Java程序 实验要求 没有Lin ...

  5. python append extend区别

    1. 列表可包含任何数据类型的元素,单个列表中的元素无须全为同一类型. 2. append() 方法向列表的尾部添加一个新的元素. 3. 列表是以类的形式实现的.“创建”列表实际上是将一个类实例化.因 ...

  6. SaltStack入门篇（四）之深入理解SaltStack远程执行

    1.目标 2.执行模块 3.返回 salt ‘*’ cmd.run ‘uptime’ 命令 目标 执行模块 执行模块参数 1.SlatStack远程执行–目标 执行目标:https://docs.sa ...

  7. js Date对象要注意的问题（时间转换）

    1.时间戳和时间对象可以灵活转变: let n = new Date() // 返回的是当前时间对应的国际时间 let nt =n.getTime() let n2 =new Date(nt) con ...

  8. C# 合并多个结构相同的DataTable

    public DataTable GetAllDataTable(DataSet ds) { DataTable newDataTable = ds.Tables[0].Clone(); //创建新表 ...

  9. javaweb(十一)——使用Cookie进行会话管理

    一.会话的概念 会话可简单理解为:用户开一个浏览器,点击多个超链接,访问服务器多个web资源,然后关闭浏览器,整个过程称之为一个会话. 有状态会话:一个同学来过教室,下次再来教室,我们会知道这个同学曾 ...

  10. Python中的装饰器的使用及固定模式

    装饰器的使用: 在不想修改函数的调用方式,但是想给函数添加内容的功能的时候使用     为什么使用装饰器: 软件实体应该是可扩展,而不可修改的.也就是说,对扩展是开放的,而对修改是封闭的. 因此,引出 ...