基于javascript实现数字英文验证码


Posted in Javascript onJanuary 25, 2017

本文实例为大家分享了js实现数字英文验证码的具体代码,供大家参考,具体内容如下

<html>
<head>
<style type="text/css">
.code{
background-image:url(111.jpg);
font-family:Arial,宋体;
font-style:italic;
color:green;
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 = new Array();
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("input1").value.toUpperCase();

if(inputCode.length <=0) {
alert("请输入验证码!");
return false;
}
else if(inputCode != code ){
alert("验证码输入错误!");
createCode();
return false;
}
else {
alert("成功!");
return true;
}
}
</script>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"></head>
<body onLoad="createCode();">

<input type="text" id="input1" />
<input type="button" id="checkCode" class="code" style="width:60px" onClick="createCode()" /> <a href="#" onClick="createCode()">看不清楚</a>
<input id="Button1" onClick="validate();" type="button" value="确定" />
<script></script>
</body>
</html>

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
通过遮罩层实现浮层DIV登录的js代码
Feb 07 Javascript
js中实现多态采用和继承类似的方法
Aug 22 Javascript
JavaScript实现更改网页背景与字体颜色的方法
Feb 02 Javascript
JS实现改变HTML上文字颜色和内容的方法
Dec 30 Javascript
浅谈ES6新增的数组方法和对象
Aug 08 Javascript
jQuery中ajax获取数据赋值给页面的实例
Dec 31 jQuery
浅谈Koa2框架利用CORS完成跨域ajax请求
Mar 06 Javascript
解决vue项目中type=”file“ change事件只执行一次的问题
May 16 Javascript
vue2.0 实现导航守卫的具体用法(路由守卫)
May 17 Javascript
详解基于vue-cli3快速发布一个fullpage组件
Mar 08 Javascript
在vue项目中使用sass语法问题
Jul 18 Javascript
JavaScript对象属性操作实例解析
Feb 04 Javascript
js阻止移动端页面滚动的两种方法
Jan 25 #Javascript
servlet+jquery实现文件上传进度条示例代码
Jan 25 #Javascript
json数据处理及数据绑定
Jan 25 #Javascript
详解jQuery中ajax.load()方法
Jan 25 #Javascript
js实现鼠标左右移动,图片也跟着移动效果
Jan 25 #Javascript
JavaScript 网页中实现一个计算当年还剩多少时间的倒数计时程序
Jan 25 #Javascript
js实现文字选中分享功能
Jan 25 #Javascript
You might like
php下获取Discuz论坛登录用户名、用户组、用户ID等信息的实现代码
2010/12/29 PHP
浅析Dos下运行php.exe,出现没有找到php_mbstring.dll 错误的解决方法
2013/06/29 PHP
ThinkPHP CURD方法之page方法详解
2014/06/18 PHP
PHP实现生成唯一编号(36进制的不重复编号)
2014/07/01 PHP
简单介绍PHP的责任链编程模式
2015/08/11 PHP
php使用正则验证中文
2016/04/06 PHP
精通Javascript系列之Javascript基础篇
2011/06/07 Javascript
javascript笔记 String类replace函数的一些事
2011/09/22 Javascript
escape编码与unescape解码汉字出现乱码的解决方法
2014/07/02 Javascript
JavaScript将Web页面内容导出到Word及Excel的方法
2015/02/13 Javascript
JS定时器用法分析【时钟与菜单中的应用】
2016/12/21 Javascript
Html5+jQuery+CSS制作相册小记录
2016/12/30 Javascript
微信小程序出现wx.navigateTo页面不跳转问题的解决方法
2017/12/26 Javascript
JavaScript实现职责链模式概述
2018/01/25 Javascript
Vue.js构建你的第一个包并在NPM上发布的方法步骤
2019/05/01 Javascript
JavaScript判断对象和数组的两种方法
2019/05/31 Javascript
Jquery $.map使用方法实例详解
2020/09/01 jQuery
vue实现下拉菜单树
2020/10/22 Javascript
Python修改MP3文件的方法
2015/06/15 Python
python友情链接检查方法
2015/07/08 Python
用十张图详解TensorFlow数据读取机制(附代码)
2018/02/06 Python
用python一行代码得到数组中某个元素的个数方法
2019/01/28 Python
详解用python写网络爬虫-爬取新浪微博评论
2019/05/10 Python
Python 类的私有属性和私有方法实例分析
2019/09/29 Python
PyTorch加载预训练模型实例(pretrained)
2020/01/17 Python
加拿大领先的牛仔零售商:Bluenotes
2018/01/22 全球购物
JRE、JDK、JVM之间的关系怎样
2012/05/16 面试题
字符串str除首尾字符外的其他字符按升序排列
2013/03/08 面试题
客服主管岗位职责
2013/12/13 职场文书
医务工作者先进事迹材料
2014/01/26 职场文书
舞蹈专业求职信
2014/06/13 职场文书
协商一致解除劳动合同协议书
2014/09/14 职场文书
出纳试用期自我评价
2015/03/10 职场文书
新课程改革心得体会
2016/01/22 职场文书
Python生成九宫格图片的示例代码
2021/04/14 Python
深入理解Pytorch微调torchvision模型
2021/11/11 Python