<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<META charset=gb2312>
<head>
<title>JS生成验证码</title>
<style>
.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>
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];
}
if (checkCode) {
checkCode.className = "code";
checkCode.value = code;
}
}
function validate() {
var inputCode = document.getElementById("input1").value;
if (inputCode.length == 0) {
alert("请输入验证码！");
} else if (inputCode.toLowerCase() != code.toLowerCase()) {
alert("验证码输入错误！");
createCode(); //刷新验证码
} else {
alert("^-^ OK");
}
}
</script>
</head>
<body onload="createCode()">
<form action="#">
<input type="text" id="input1" />
<input type="text" onclick="create()" readonly="readonly" id="checkCode" class="unchanged" style="width: 80px" />
<br />
<input id="Button1" onclick="validate();" type="button" value="确定" />
</form>
</body>
</html>
此仅为本人刚刚接触java时的随身记录的样式
不能作为主要参考