<!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 id="Head1" runat="server">
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8" />
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>登录验证码</title>
<style type="text/css">
body{background-color: #e6f3f9;}
.zi_lan_14{ font-size: 14px; width:"100px" color: #003174; text-decoration: none;}
.zi_lan_12{ font-size: 12px; width:"100px" line-height: 24px; color: #003174; text-decoration: none;}
.bk{ border: 1px solid #006699; height: 18px;}
.zi_hong_12{ font-size: 12px; line-height: 24px; color: #CC0000; text-decoration: none;}
.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 type="text/javascript">
function KillSpace(x) {
while ((x.length > 0) && (x.charAt(0) == ' '))
x = x.substring(1, x.length)
while ((x.length > 0) && (x.charAt(x.length - 1) == ' '))
x = x.substring(0, x.length - 1)
return x
}
function CheckForm() {
//document.LoginForm.UserName.value=KillSpace(document.LoginForm.UserName.value);
document.all('UserName').value = KillSpace(document.all('UserName').value)
if (document.all('UserName').value.length == 0) {
alert('\n请输入您的用户名!')
document.all('UserName').focus();
return false;
}
document.all('Password').value = KillSpace(document.all('Password').value);
if (document.all('Password').value == 0) {
alert('\n请输入您的密码!');
document.all('Password').focus();
return false;
}
if (!validate()) {
document.getElementById("Code").focus();
document.getElementById("Code").select();
return false;
}
return true;
}
var code; //在全局 定义验证码
function createCode() {
code = "";
var codeLength = 4; //验证码的长度
var checkCode = document.getElementById("checkCode");
checkCode.value = "";
var selectChar = new Array(2, 3, 4, 5, 6, 7, 8, 9, 'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'J', 'K', 'L', 'M', 'N', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z');
for (var i = 0; i < codeLength; i++) {
var charIndex = Math.floor(Math.random() * 32);
code += selectChar[charIndex];
}
if (code.length != codeLength) {
createCode();
}
checkCode.value = code;
}
return false;
}
else if (inputCode != code) {
alert("验证码输入错误!");
createCode();
return false;
}
else {
// alert("OK");
return true;
}
}
</script>
</head>
<body οnlοad="document.getElementById('UserName').focus();createCode();">
<form id="form2">
<div style="margin-top: 80px">
<table width="360px" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td height="100px" align="right" class="zi_lan_12">
用户名:
</td>
<td colspan="3" align="left">
<input type="text " ID="UserName" CssClass="bk" MaxLength="20" Width="150px"/>
</td>
</tr>
<tr>
<td height="100px" align="right" class="zi_lan_12">
密码:
</td>
<td colspan="3" align="left">
<input type="password" ID="Password" CssClass="bk" MaxLength="20" Width="150px"/>
</td>
</tr>
<tr>
<td width="100px" height="40" align="right" class="zi_lan_12">
验证码:
</td>
<td width="90px" align="left">
<input type="text" ID="Code" runat="server" CssClass="bk" MaxLength="4" Width="80px"/>
</td>
<td width="70px" align="center">
<input type="text" id="checkCode" class="code" readonly="true" style="width: 55px" />
</td>
<td width="80px" align="right" class="zi_lan_12">
<a href="#" οnclick="createCode()">看不清楚</a>
</td>
</tr>
<tr>
<td height="50px" width="60" colspan="4" align="center" valign="middle">
<input type="button" ID="btnLogin" value="登录" OnClick="CheckForm()" />
</td>
</tr>
</table>
</div>
</form>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8" />
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>登录验证码</title>
<style type="text/css">
body{background-color: #e6f3f9;}
.zi_lan_14{ font-size: 14px; width:"100px" color: #003174; text-decoration: none;}
.zi_lan_12{ font-size: 12px; width:"100px" line-height: 24px; color: #003174; text-decoration: none;}
.bk{ border: 1px solid #006699; height: 18px;}
.zi_hong_12{ font-size: 12px; line-height: 24px; color: #CC0000; text-decoration: none;}
.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 type="text/javascript">
function KillSpace(x) {
while ((x.length > 0) && (x.charAt(0) == ' '))
x = x.substring(1, x.length)
while ((x.length > 0) && (x.charAt(x.length - 1) == ' '))
x = x.substring(0, x.length - 1)
return x
}
function CheckForm() {
//document.LoginForm.UserName.value=KillSpace(document.LoginForm.UserName.value);
document.all('UserName').value = KillSpace(document.all('UserName').value)
if (document.all('UserName').value.length == 0) {
alert('\n请输入您的用户名!')
document.all('UserName').focus();
return false;
}
document.all('Password').value = KillSpace(document.all('Password').value);
if (document.all('Password').value == 0) {
alert('\n请输入您的密码!');
document.all('Password').focus();
return false;
}
if (!validate()) {
document.getElementById("Code").focus();
document.getElementById("Code").select();
return false;
}
return true;
}
var code; //在全局 定义验证码
function createCode() {
code = "";
var codeLength = 4; //验证码的长度
var checkCode = document.getElementById("checkCode");
checkCode.value = "";
var selectChar = new Array(2, 3, 4, 5, 6, 7, 8, 9, 'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'J', 'K', 'L', 'M', 'N', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z');
for (var i = 0; i < codeLength; i++) {
var charIndex = Math.floor(Math.random() * 32);
code += selectChar[charIndex];
}
if (code.length != codeLength) {
createCode();
}
checkCode.value = code;
}
function validate() {
var inputCode = document.getElementById("Code").value.toUpperCase();
if (inputCode.length <= 0) {
alert("请输入验证码!");return false;
}
else if (inputCode != code) {
alert("验证码输入错误!");
createCode();
return false;
}
else {
// alert("OK");
return true;
}
}
</script>
</head>
<body οnlοad="document.getElementById('UserName').focus();createCode();">
<form id="form2">
<div style="margin-top: 80px">
<table width="360px" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td height="100px" align="right" class="zi_lan_12">
用户名:
</td>
<td colspan="3" align="left">
<input type="text " ID="UserName" CssClass="bk" MaxLength="20" Width="150px"/>
</td>
</tr>
<tr>
<td height="100px" align="right" class="zi_lan_12">
密码:
</td>
<td colspan="3" align="left">
<input type="password" ID="Password" CssClass="bk" MaxLength="20" Width="150px"/>
</td>
</tr>
<tr>
<td width="100px" height="40" align="right" class="zi_lan_12">
验证码:
</td>
<td width="90px" align="left">
<input type="text" ID="Code" runat="server" CssClass="bk" MaxLength="4" Width="80px"/>
</td>
<td width="70px" align="center">
<input type="text" id="checkCode" class="code" readonly="true" style="width: 55px" />
</td>
<td width="80px" align="right" class="zi_lan_12">
<a href="#" οnclick="createCode()">看不清楚</a>
</td>
</tr>
<tr>
<td height="50px" width="60" colspan="4" align="center" valign="middle">
<input type="button" ID="btnLogin" value="登录" OnClick="CheckForm()" />
</td>
</tr>
</table>
</div>
</form>
</body>
</html>