<!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 runat="server">
<title></title>
<style type="text/css">
.code
{
background:url(code_bg.jpg);
font-family:Arial;
font-style:italic;
color:blue;
font-size:30px;
border:0;
padding:2px 3px;
letter-spacing:3px;
font-weight:bolder;
float:left;
cursor:pointer;
width:150px;
height:60px;
line-height:60px;
text-align:center;
vertical-align:middle;
}
a
{
text-decoration:none;
font-size:12px;
color:#288bc4;
}
a:hover
{
text-decoration:underline;
}
</style>
<script language="javascript" type="text/javascript">
var code;
function createCode() {
code = "";
var codeLength = 6; //验证码的长度
var checkCode = document.getElementById("checkCode");
var codeChars = 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 charNum = Math.floor(Math.random() * 52);
code += codeChars[charNum];
}
if (checkCode)
{
checkCode.className = "code";
checkCode.innerHTML = code;
}
}
function validateCode()
{
var inputCode = document.getElementById("inputCode").value;
if (inputCode.length <= 0)
{
alert("请输入验证码！");
}
else if (inputCode.toUpperCase() != code.toUpperCase())
{
alert("验证码输入有误！");
createCode();
}
else
{
alert("验证码正确！");
}
}
</script>
</head>
<body onload="createCode()">
<form id="form1" runat="server" onsubmit="validateCode()">
<div>
<table border="0" cellspacing="5" cellpadding="5" >
<tr>
<td></td><td> <div class="code" id="checkCode" onclick="createCode()" ></div></td>
<td><a href="#" onclick="createCode()">看不清换一张</a></td>
</tr>
<tr>
<td>验证码：</td><td><input style="float:left;" type="text" id="inputCode" /></td><td>请输入验证码</td>
</tr>
<tr><td></td><td><input id="Button1" onclick="validateCode();" type="button" value="确定" /></td><td></td>
</tr>
</table>
</div>
</form>
</body>
</html>
相关推荐
纯javascript验证码 ，自动生成验证码
### JavaScript验证码破解详解 #### 一、背景介绍 随着网络安全意识的提高，许多网站开始采用验证码（CAPTCHA）作为防止自动化攻击的一种手段。验证码的主要作用是区分人类用户与自动化程序，确保系统的安全性。...
简单验证码页面模板页面 JavaScript 实现简单的验证码
以下是一个简单的JavaScript验证码实现示例： ```javascript document.addEventListener('DOMContentLoaded', function() { var canvas = document.getElementById('captcha'); var ctx = canvas.getContext('2d'...
文件主要有html构成，安全的实现了验证码的验证。
内容概要：本文通过一个具体实例介绍了如何使用HTML、CSS以及JavaScript实现一个带有验证码功能的登录窗口。主要包括创建登录界面的HTML结构、设置界面样式的CSS代码以及生成验证码、验证登录信息的JavaScript代码。...
JavaScript生成验证码(一)! 值得下载看看!资源免费,大家分享!!
JavaScript验证码可以通过生成动态图像并添加一些混淆元素来实现这一目的。 创建JavaScript验证码的步骤如下： 1. **生成随机字符串**：首先，我们需要生成一个包含字母和数字的随机字符串，作为验证码的内容。...
JavaScript验证码的简单实现，有简单的随机数字，也有较复杂的图形验证码， 这种图形验证码很高效简洁，使用爬虫是有较大难度的爬取网站信息的。 而且这种图形验证码的应用场景非常广，可用在登录注册等等需要上传...
在Web开发中，JavaScript验证码插件是实现这一功能的便捷工具，尤其对于前端开发者来说，它们提供了简单易用的解决方案。本篇文章将详细探讨基于JavaScript的验证码插件，特别是针对“js验证码插件，简单易用，图片...
JavaScript验证码是一种用于验证用户身份的安全机制，常用于防止自动化脚本或机器人进行恶意操作，如注册、登录等。本文将详细解析所提供的JavaScript验证码实例代码，包括其主要功能、实现方式和关键代码段。 首先...
### JavaScript身份证验证码实现原理与代码解析 在当前数字化时代，身份验证成为了线上交易、数据安全等领域不可或缺的一环。其中，身份证验证是确保用户身份真实性的重要手段之一。本文将基于提供的JavaScript脚本...
本篇文章将深入探讨JavaScript验证码的相关知识点。 首先，验证码的核心目的是增加用户交互中的复杂性，使得自动化程序难以模拟人类行为。JavaScript验证码通常包含以下几个关键组成部分： 1. **生成验证码**：在...
我们将探讨JSP验证码的原理、实现方式以及与JavaScript验证码的对比。 验证码的核心在于它的随机性和一次性。随机性确保每次请求时生成的验证码都是不同的，而一次性则意味着一旦验证码被使用或验证，它将失效。在...
综上所述，这份资源提供的JavaScript验证码生成代码是一个很好的学习实例，它涵盖了JavaScript图形绘制、随机数生成以及安全验证的基本概念。对于想要提升Web安全性和用户体验的开发者来说，理解并掌握这些技术至关...
JavaScript验证码是通过在客户端实现的一种验证机制，能够减轻服务器的压力，提高网站安全性。本篇文章将深入探讨如何使用JavaScript实现一个简单易懂的验证码功能。 首先，我们需要理解验证码的基本原理。验证码...
对于JavaScript验证码，通常会配合Ajax技术，当用户提交表单时，服务器会验证输入的验证码是否与服务器端保存的一致，如果不一致，则返回错误提示。 在"CheckCode"这个文件中，很可能是包含了一个完整的JavaScript...
用JavaScript 刷新验证码
一个基本的JavaScript验证码生成示例可能包括以下步骤： - 创建一个HTML元素（如`<div>`或`<canvas>`）用于显示验证码。 - 使用JavaScript生成随机字符串。 - 如果使用Canvas，使用`canvas.getContext('2d')`...