<html>
<head>
<meta charset="UTF-8">
<title>验证码</title>
<script type="text/javascript" src="js/jquery-1.7.2.js" ></script>
<style>
#code{
color:blue;
font-size:30px;
font-weight:bolder;
cursor:pointer;
text-align:center;
}
</style>
<body>
<div>
<p>验证码</p>
<div>
<input type="text" id="inputcode" onblur="judge()" style="margin-top: 10px;"/>
<span style="background-color: yellow;" id="code" onclick="create()"></span>
</div>
</div>
</body>
<script type="text/javascript">
$(function(){
create();
});
var code;
var create = function(){
code="";
var codeLength=6;
var code_array = 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 index = Math.floor(Math.random() * 62);
code+=code_array[index];
}
$("#code").html(code);
}
var judge = function(){
var inputcode = $("#inputcode").val();
if(inputcode == code){
alert("OK")
}else{
alert("NO")
create();
}
}
</script>
</html>