JS密码强度验证

<%@ Page Language="C#" %>

<!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 id="Head1" runat="server">

    <title>无标题页</title>

    <script language="javascript" type="text/javascript">

    //CharMode函数

    //测试某个字符是属于哪一类.

    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;

    }

    //checkStrong函数

    //返回密码的强度级别  

    function checkStrong(sPW){

        if (sPW.length<=4)

        return 0; //密码太短

        Modes=0;

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

        //测试每一个字符的类别并统计一共有多少种模式.

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

        }

        return bitTotal(Modes);

    }  

    //pwStrength函数

    //当用户放开键盘或密码输入框失去焦点时,根据不同的级别显示不同的颜色

    function pwStrength(pwd){

        O_color="#e0f0ff";

        L_color="#FF0000";

        M_color="#FF9900";

        H_color="#33CC00";

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

            Lcolor=Mcolor=Hcolor=O_color;

        }

        else

        {

            S_level=checkStrong(pwd);

            switch(S_level)

            {

                case 0:

                Lcolor=Mcolor=Hcolor=O_color;

                case 1:

                Lcolor=L_color;

                Mcolor=Hcolor=O_color;

                break;

                case 2:

                Lcolor=Mcolor=M_color;

                Hcolor=O_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 id="form1" runat="server">

    <div>

        输入密码:<input id="TextBox1" runat="server" onkeyup="pwStrength(this.value)" onblur="pwStrength(this.value)" /><br />

        密码强度:

        <table border="1" cellpadding="1" cellspacing="1" borderColorDark="#fdfeff" borderColorLight="#99ccff" style="width: 200px; display: inline; background-color:#e0f0ff">

            <tr>

                <td id="strength_L" style="width: 100px; height: 19px;" align="center">

                    弱</td>

                <td id="strength_M" style="width: 100px; height: 19px;" align="center">

                    中</td>

                <td id="strength_H" style="width: 100px; height: 19px;" align="center">

                    强</td>

            </tr>

        </table>

    </div>

    </form>

</body>

</html>

效果如图：

js验证密码强弱的更多相关文章

  1. 原生JS判断密码强弱

    前些天工作中有这个需求,自己手写了相关的JS代码,第一种方法是通过ASCII 码判断密码类型,完成用户注册时判断用户输入密码的强度,分强.弱.中三等级,它可以根据用户输入的密码显示对应的密码强弱等级, ...

  2. 载 js验证密码 必须由大小写字母、数字和特殊字符组成

    转自:https://blog.csdn.net/weixin_43824935/article/details/93601064 密码长度8-16位 必须由大写字母,小写字母,数字,特殊符号组成 正 ...

  3. 第一百五十节，封装库--JavaScript，表单验证--密码验证

    封装库--JavaScript,表单验证--密码验证 效果图 html <div id="reg"> <h2 class="tuo">& ...

  4. js验证表单密码、用户名是否输入--JS的简单应用

    在登录.注册时,我们经常会遇到下面这种情况,如果我们没有输入用户名.密码时,系统会弹出提示框.提示框信息提示内容是我们密码没有输入密码或者用户名等.那么这样的弹出框效果是如何实现的呢?文章标题既然与j ...

  5. JS高级---案例：验证密码的强度

    案例:验证密码的强度 1. 给我密码,我返回对应的级别 2. 每次键盘抬起都要获取文本框中的内容, 验证文本框中有什么东西, 得到一个级别, 然后下面的div显示对应的颜色 <!DOCTYPE ...

  6. JS简单验证密码强度

    <input type="password" id="password" value=""/><button id=&qu ...

  7. 原生js验证简洁美观注册登录页面

    序 一个以js验证表单的简洁的注册登录页面,不多说直接上图 效果 主要文件 完整代码 sign_up.html 注册表单 <!DOCTYPE html> <html lang=&qu ...

  8. ASP.NET开发中主要的字符验证方法-JS验证、正则表达式、验证控件、后台验证

    ASP.NET开发中主要的字符验证方法-JS验证.正则表达式.验证控件.后台验证 2012年03月19日 星期一 下午 8:53 在ASP.NET开发中主要的验证方法收藏 <1>使用JS验 ...

  9. 分享我常用的一些JS验证和函数

    下面是我常用一些JS验证和函数,有一些验证我直接写到了对象的属性里面了,可以直接通过对象.方法来调用//浮点数除法运算 function fdiv(a, b, n) { if (n == undefi ...

随机推荐

  1. docker 快速搭建 mysql

    准备工作 系统 centos7 切换阿里源 #备份资源文件 mv /etc/yum.repos.d/CentOS-Base.repo /etc/yum.repos.d/CentOS-Base.repo ...

  2. 远程链接mongoDB robomongo

    墙裂推荐一个软件robomongo 下载地址:https://robomongo.org/download 最初不用这个软件的时候需要shell链接mongoDB,折腾了半天结果版本不匹配 用robo ...

  3. [VC]socket含义

    两个程序之间的通信方法.Socket 是一种识别码,应用程式可用此唯一识别通信端点.用户创建 Socket 地址与Socket 的关联性后,便可创建通信协议地址与Socket 的关联性.

  4. 【BZOJ2141】排队

    点此看题面 大致题意: 给你一个序列,每次交换两个数,求每次操作后的逆序对个数. 关于另一道题目 推荐先去看一下这道题目:[洛谷3759][TJOI2017] 不勤劳的图书管理员(貌似是此题的升级版) ...

  5. mongodb索引 全文索引使用限制

    全文索引非常强大,但是同样存在很多限制,我们来看以下去全文索引的使用限制: 1.每次查询,只能指定一个$text查询 2.$text查询不能出现在$nor查询中 之前没有接触过$nor查询,$nor查 ...

  6. 求和VII

    问题 K: 求和VII 时间限制: 2 Sec  内存限制: 256 MB提交: 422  解决: 53[提交] [状态] [讨论版] [命题人:admin] 题目描述 master对树上的求和非常感 ...

  7. Java 发送 Https 请求工具类 （兼容http）

    依赖 jsoup-1.11.3.jar <dependency> <groupId>org.jsoup</groupId> <artifactId>js ...

  8. nginx入门学习步骤(linux)

    一.nginx下载(nginx-1.9.9) http://nginx.org/download/ 二.解压到指定文件夹 tar -zxvf 解压缩文件 三.设置配置信息 在nignx解压文件夹内执行 ...

  9. nginx反向代理与正向代理的区别

    http://blog.csdn.net/m13666368773/article/details/8060481

  10. IOS后台执行

    大多数应用程序进入后台状态不久后转入暂停状态.在这种状态下,应用程序不执行任何代码,并有可能在任意时候从内存中删除.应用程序提供特定的服务,用户可以请求后台执行时间,以提供这些服务. 判断是否支持多线 ...