JS生成登录验证码
2015-12-06 21:02
1176 查看
<!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> <title>JS生成验证码</title> <meta charset="UTF-8" > <style type="text/css"> .code { background-image: url(code.jpg); font-family: Arial; font-style: italic; color: Red; border: 0; padding: 2px 3px; letter-spacing: 3px; font-weight: bolder; } .unchanged { border: 0; } </style> <script language="javascript" type="text/javascript"> var code; //在全局 定义验证码 function createCode() { code = ""; var codeLength = 4;//验证码的长度 var checkCode = document.getElementById("checkCode"); var selectChar = 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');//所有候选组成验证码的字符,当然也可以用中文的 for (var i = 0; i < codeLength; i++) { var charIndex = Math.floor(Math.random() * 36); code += selectChar[charIndex]; } //alert(code); if (checkCode) { checkCode.className = "code"; checkCode.value = code; } } function validate() { var inputCode = document.getElementById("input1").value; if (inputCode.length <= 0) { alert("请输入验证码!"); createCode();//刷新验证码 return false; } else if (inputCode != code) { alert("验证码输入错误!"); createCode();//刷新验证码 return false; } else { alert("^-^ OK"); return true; } } </script> </head> <body onload="createCode()"> <form action="#"> <input type="text" id="input1" /> <input type="text" onclick="createCode()" readonly="readonly" id="checkCode" class="unchanged" style="width: 80px" /><br /> <input id="Button1" onclick="validate();" type="button" value="确定" /> </form> </body> </html>
相关文章推荐
- JavaScript:wihdow.onload与DOMContentLoaded,onreadystate
- JavaScript-数字和字符串比较大小
- JavaScript的学习要点
- JavaScript 数组乱序方法
- javascript必知必会之prototype
- Microsoft 开源 Edge 浏览器的 javascript 引擎
- Java运用JSON实现后台与前端分工合作(代码实例)
- Javascript继承的概念理解
- js返回,页面暂存
- 实现Entity,Dao,Service,Controller,JSP代码生成神器
- Extjs 6 MVC开发模式(二)
- js中==和===的区别
- js array.length 问题
- 添加和删除选项:javascript
- JSONModel 遇见关键字为id或者description
- JavaScript创建cookie
- What is JSON?
- 联动菜单:javaScript
- 【JavaScript】(5)——JavaScript与cookie、XML交互
- javascript导图