您的位置：首页 > 其它

好用的验证码

2015-11-20 14:30 155 查看

之前一直在新浪博客，/*哈哈其实也没写几个*/，太难用了，以后定居在这里以及我的个人网站，/*我的个人网站目前出了点问题，等弄好后一起更新*/。

下面是一个比较好用的数字随机验证码，如果希望添加字母，可查看代码里的备注。

<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>验证</title>
<script type="text/javascript" src="http://192.168.107.99:80/static/js/jquery-1.8.3.min.js"></script>
<script type="text/javascript" src="http://192.168.107.99:80/static/js/common.js"></script>
<script 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);*///所有候选组成验证码的字符，当然也可以用中文的，也可以用字母在这里添加
for (var i = 0; i < codeLength; i++) {
var charIndex = Math.floor(Math.random()*10);
code += /*selectChar[*/charIndex/*]*/;
}
if (checkCode) {
checkCode.className = "code";
checkCode.value = code;
}
}
function validate() {
var inputCode = document.getElementById("VerifyCode").value;
if (inputCode.length <= 0) {
alert("请输入验证码！");
} else if (inputCode != code) {
alert("验证码输入错误！");
createCode();//刷新验证码
} else {
$("#loginfrm").submit();
}
}
$(function(){
tip("#loginfrm");
createCode();
})
</script>
<style>
.login-v {
height:24px;
border:1px solid  #25488c;
padding-left: 3px;
}
.code {
background-image: url(code.jpg);
width:80px;
height:24px;
font-family: "Microsoft YaHei";
color:#25488c;
text-align:center;
font-size:14px;
letter-spacing: 3px;
border:1px solid  #25488c;
}
#checkCode {margin-top:0px}
.unchanged {border: 0;}
.error {
color:red;
font-size:10pt;
padding-left:2px;
line-height:20px;
}
</style>
</head>
<body>
<div class="login-container">
<label>验证码 :</label>
<input class="login-v" maxlength="4" name="VerifyCode" type="text"/>
<input type="text" onclick="createCode()" readonly="readonly" class="code" id="checkCode"/>
</div>
</body>
</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航