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. Sonar服务器搭建

    Sonar服务器搭建 Sonar概述 Sonar 是一个用于代码质量管理的开放平台.通过插件机制,Sonar 可以集成不同的测试工具,代码分析工具,以及持续集成工具.与持续集成工具(例如 Hudson ...

  2. IOS 绘制基本图形(画文字、图片水印）

    - (void)drawRect:(CGRect)rect { // Drawing code // [self test]; // 1.加载图片到内存中 UIImage *image = [UIIm ...

  3. 黑幕背后的Autorelease

    http://blog.sunnyxx.com/2014/10/15/behind-autorelease/ 我是前言 Autorelease机制是iOS开发者管理对象内存的好伙伴,MRC中,调用[o ...

  4. 2018.10.24 NOIP2018模拟赛 解题报告

    得分: \(100+0+100=200\)(\(T2\)悲惨爆\(0\)) \(P.S.\)由于原题是图片,所以我没有上传题目描述,只有数据. \(T1\):query(点此看题面) 熟悉主席树的人都 ...

  5. 【ML】聊天机器人

    继做过了泰语分词,自动对对对联后对聊天机器人产生了浓厚的兴趣.ChatBot集合了NLP,DL等多领域的应用. https://deeppavlov.ai/ https://www.rasa.com/ ...

  6. PAT (Advanced Level) Practise - 1093. Count PAT's (25)

    http://www.patest.cn/contests/pat-a-practise/1093 The string APPAPT contains two PAT's as substrings ...

  7. 漫谈Ajax在.Net中的使用

    引用地址:http://birdshover.cnblogs.com/archive/2006/07/03/441439.html AJAX出来的时间也不短了.虽然它在某些方面很受争议,但是瑕不掩瑜. ...

  8. mysql 5.7 编译安装脚本。

    此脚本尽量运行在centos 服务器上面,用于编译安装mysql 5.7 将此脚本和相应的软件 都放到/usr/local/src 目录下面 由于不能上传附件  所以需要把cmake-3.9.6.ta ...

  9. java--creater in windows

    电脑右键--高级--属性--更改环境变量 1.JAVA_HOME  C:\Program Files\Java\jdk1.7.0_04 2. Path                     %JAV ...

  10. day23-python之日志 re模块

    1.logging import logging #-----------------------------------logging.basicConfig logging.basicConfig ...