zoukankan      html  css  js  c++  java
  • js 密码强弱的实现

    页面代码:

    <table>
            <tr><td><input type="text" id="txtPwd" /></td></tr>
            <tr><td>
                <table id="pwdLever">
                    <tr>
                        <td></td>
                        <td></td>
                        <td></td>
                    </tr>
                </table>
            </td></tr>
        </table>

    样式:

    <style type="text/css">
            #pwdLever td
            {
               background-color:Gray;
               width:45px;
               text-align:center;
            }
        </style>

    js代码:

    <script type="text/javascript">
            window.onload = function () {
                var textInput = document.getElementById("txtPwd");
                //给密码输入框 注册键放开事件
                textInput.onkeyup = function () {
                    var pwdValue = this.value;
                    var num = pwdChange(pwdValue);
                    var tds = document.getElementById("pwdLever").getElementsByTagName("td");
                    //修改密码颜色
                    if (num == 0 || num == 1) {
                        tds[0].style.backgroundColor = "red";
                        tds[1].style.backgroundColor = "gray";
                        tds[2].style.backgroundColor = "gray";
                    }
                    else if (num == 2) {
                        tds[0].style.backgroundColor = "red";
                        tds[1].style.backgroundColor = "red";
                        tds[2].style.backgroundColor = "gray";
                    }
                    else if (num == 3) {
                        tds[0].style.backgroundColor = "red";
                        tds[1].style.backgroundColor = "red";
                        tds[2].style.backgroundColor = "red";
                    }
                    else {
                        tds[0].style.backgroundColor = "gray";
                        tds[1].style.backgroundColor = "gray";
                        tds[2].style.backgroundColor = "gray";
                    }
                }
            }
            function pwdChange(v) {
                var num = 0;
                var reg = /\d/; //如果有数字
                if (reg.test(v)) {
                    num++;
                }
                reg = /[a-zA-Z]/; //如果有字母
                if (reg.test(v)) {
                    num++;
                }
                reg = /[^0-9a-zA-Z]/; //如果有特殊字符
                if (reg.test(v)) {
                    num++;
                }
                if (v.length < 6) { //如果密码小于6
                    num--;
                }
                return num;
            }
        </script>
  • 相关阅读:
    (9)在结果中筛选
    (8)为列表结果分页
    (7)为结果排序
    (6)找回忘记的密码
    (3)验证用户的输入
    (5)发送欢迎邮件
    (4)实现多语言
    (2)通过脚手架自动生成controller和view ----代码先行/数据库先行
    (1)用密码保护限制对view的访问
    (转)scanf()总结
  • 原文地址:https://www.cnblogs.com/nianlee/p/2972712.html
Copyright © 2011-2022 走看看