登录注册验证码 js

来源：互联网发布：网络机顶盒刷机通用版编辑：程序博客网时间：2024/05/22 14:19

文件下载传送门—–http://pan.baidu.com/s/1nuMLIQ1

css部分：

<style type="text/css">        .code {  font-style: italic;  color: blue;  font-size: 30px;  border: 0;  padding: 2px 3px;            letter-spacing: 3px;  font-weight: bolder;  float: left;  cursor: pointer;            width: 150px;  height: 60px;  line-height: 60px;  text-align: center;  vertical-align: middle;  }        a {  text-decoration: none;  font-size: 12px;  color: #288bc4;  }        a:hover {  text-decoration: underline;  }    </style>

js部分：

<script>        var code;        function createCode() {            code = "";            var codeLength = 4; //验证码的长度            var checkCode = document.getElementById("checkCode");            var codeChars = new Array(0, 1, 2, 3, 4, 5, 6, 7, 8, 9,                    'a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', 'l', 'm', 'n', 'o', 'p', 'q', 'r', 's', 't', 'u', 'v', 'w', 'x', 'y', 'z',                    'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z'); //所有候选组成验证码的字符，当然也可以用中文的            for (var i = 0; i < codeLength; i++) {                var charNum = Math.floor(Math.random() * 52);                code += codeChars[charNum];            }            if (checkCode) {                checkCode.className = "code";                checkCode.innerHTML = code;            }        }        function validateCode() {            var inputCode = document.getElementById("inputCode").value;            if (inputCode.length <= 0) {                alert("请输入验证码！");            }            else if (inputCode.toUpperCase() != code.toUpperCase()) {                alert("验证码输入有误！");                createCode();            }            else {                alert("验证码正确！");            }        }    </script>

html部分：

<body onload="createCode()"><form id="form1" onsubmit="validateCode()">    <div>        <table border="0" cellspacing="5" cellpadding="5">            <tr>                <td></td>                <td>                    <div class="code" id="checkCode" onclick="createCode()"></div>                </td>                <td><a href="#" onclick="createCode()">看不清换一张</a></td>            </tr>            <tr>                <td>验证码：</td>                <td><input style="float:left;" type="text" id="inputCode"/></td>                <td>请输入验证码</td>            </tr>            <tr>                <td></td>                <td><input id="Button1" onclick="validateCode();" type="button" value="确定"/></td>                <td></td>            </tr>        </table>    </div></form></body>

0 0