javascript实现数字+字母验证码的简单实例
更新时间：2014年02月10日 08:53:41 作者：
本篇文章只要是对javascript实现数字+字母验证码的简单实例进行了介绍，需要的朋友可以过来参考下，希望对大家有所帮助
实例如下：
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>js验证码</title>
<style type="text/css">
.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 language="javascript" 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,'a','b','c','d','e','f','g','h','i','j','k','l','m','n','o','p','q','r','s','t','u','v','wW','x','y','z');//所有候选组成验证码的字符，当然也可以用中文的
for(var i=0;i<codeLength;i++)
{
var charIndex = Math.floor(Math.random()*36);
code +=selectChar[charIndex];
}
// alert(code);
if(checkCode)
{
checkCode.className="code";
checkCode.value = code;
}
}
function validate ()
{
var inputCode = document.getElementById("input1").value;
if(inputCode.length <=0)
{
alert("请输入验证码！");
}
else if(inputCode != code )
{
alert("验证码输入错误！");
createCode();//刷新验证码
}
else
{
alert("OK");
}
}
</script>
</head>
<body onload="createCode()">
<form action="#">
<input type="text" id="input1" />
<input type="text" onclick="createCode()" readonly="readonly" id="checkCode" class="unchanged" style="width: 80px" /><br />
<input id="Button1" onclick="validate();" type="button" value="确定" />
</form>
</body>
</html>
复制代码 代码如下:
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>js验证码</title>
<style type="text/css">
.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 language="javascript" 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,'a','b','c','d','e','f','g','h','i','j','k','l','m','n','o','p','q','r','s','t','u','v','wW','x','y','z');//所有候选组成验证码的字符，当然也可以用中文的
for(var i=0;i<codeLength;i++)
{
var charIndex = Math.floor(Math.random()*36);
code +=selectChar[charIndex];
}
// alert(code);
if(checkCode)
{
checkCode.className="code";
checkCode.value = code;
}
}
function validate ()
{
var inputCode = document.getElementById("input1").value;
if(inputCode.length <=0)
{
alert("请输入验证码！");
}
else if(inputCode != code )
{
alert("验证码输入错误！");
createCode();//刷新验证码
}
else
{
alert("OK");
}
}
</script>
</head>
<body onload="createCode()">
<form action="#">
<input type="text" id="input1" />
<input type="text" onclick="createCode()" readonly="readonly" id="checkCode" class="unchanged" style="width: 80px" /><br />
<input id="Button1" onclick="validate();" type="button" value="确定" />
</form>
</body>
</html>
相关文章
window.print打印指定div指定网页指定区域的方法
这篇文章主要介绍了window.print打印指定div指定网页指定区域的方法,需要的朋友可以参考下2014-08-08
本文详细探讨了JavaScript闭包的概念、作用、原理及优缺点,闭包允许函数访问其词法作用域中的变量,即使外部函数已执行,闭包有助于解决全局变量污染问题,提供私有变量和方法,但也会导致内存占用和内存泄露,通过示例,展示了闭包的实现和应用场景,感兴趣的朋友一起看看吧2025-01-01
今天在研究微信公众号接口问题,下面这篇文章主要给大家介绍了关于微信公众平台API错误代码41002问题的解决办法,文中通过代码介绍的非常详细,需要的朋友可以参考下2024-09-09
$$()函数应用实例...2006-10-10
这篇文章主要为大家详细介绍了js实现本地时间同步功能，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-08-08
这篇文章主要介绍了JavaScript设计模式之适配器模式介绍,适配器模式,一般是为要使用的接口,不符本应用或本系统使用,而需引入的中间适配层类或对象的情况,需要的朋友可以参考下2014-12-12
这篇文章主要介绍了JS 实现请求调度器的方法，帮助大家更好的理解和学习使用js，感兴趣的朋友可以了解下2021-03-03
这篇文章主要为大家详细介绍了用webAPI实现图片放大镜效果，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2020-11-11
js关闭父窗口时关闭子窗口的实例，需要的朋友可以参考一下2013-04-04
这篇文章主要介绍了javascript弹出层输入框(示例代码)。需要的朋友可以过来参考下，希望对大家有所帮助2013-12-12
最新评论