基于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 相关文章推荐
In Javascript Class, how to call the prototype method.(three method)
Jan 09 Javascript
excel操作之Add Data to a Spreadsheet Cell
Jun 12 Javascript
javascript 冒泡排序 正序和倒序实现代码
Dec 14 Javascript
jquery实现图片随机排列的方法
May 04 Javascript
jQuery的Scrollify插件实现滑动到页面下一节点
Jul 05 Javascript
jQuery zTree加载树形菜单功能
Feb 25 Javascript
js阻止默认浏览器行为与冒泡行为的实现代码
May 15 Javascript
jQuery EasyUI学习教程之datagrid点击列表头排序
Jul 09 Javascript
jQuery插件zTree实现的多选树效果示例
Mar 08 Javascript
微信小程序实战之登录页面制作(5)
Mar 30 Javascript
vue图片上传本地预览组件使用详解
Feb 20 Javascript
前端Vue项目详解--初始化及导航栏
Jun 24 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调用数据库的存贮过程!
2006/10/09 PHP
怎么样可以把 phpinfo()屏蔽掉?
2006/11/24 PHP
Ajax实时验证用户名/邮箱等是否已经存在的代码打包
2011/12/01 PHP
PHP获取浏览器信息类和客户端地理位置的2个方法
2014/04/24 PHP
基于jQuery实现表格数据的动态添加与统计的代码
2011/01/31 Javascript
JavaScript高级程序设计阅读笔记(五) ECMAScript中的运算符(一)
2012/02/27 Javascript
js里怎么取select标签里的值并修改
2012/12/10 Javascript
Js中setTimeout()和setInterval() 何时被调用执行的用法
2013/04/12 Javascript
了不起的node.js读书笔记之mongodb数据库交互
2014/12/22 Javascript
JavaScript实现穷举排列(permutation)算法谜题解答
2014/12/29 Javascript
jQuery插件slick实现响应式移动端幻灯片图片切换特效
2015/04/12 Javascript
把Node.js程序加入服务实现随机启动
2015/06/25 Javascript
JS实现浏览器状态栏显示时间的方法
2015/10/27 Javascript
js实现文件上传表单域美化特效
2015/11/02 Javascript
Bootstrap每天必学之缩略图与警示窗
2015/11/29 Javascript
jQuery实现简单的图片查看器
2020/09/11 Javascript
Node.js插件安装图文教程
2016/05/06 Javascript
原生JS实现圣旨卷轴展开效果
2017/03/06 Javascript
less简单入门(CSS 预处理语言)
2017/03/08 Javascript
react-native ListView下拉刷新上拉加载实现代码
2017/08/03 Javascript
JS获取动态添加元素的方法详解
2019/07/31 Javascript
微信小程序添加插屏广告并设置显示频率(一天一次)
2019/12/06 Javascript
NUXT SSR初级入门笔记(小结)
2019/12/16 Javascript
windows系统下Python环境搭建教程
2017/03/28 Python
利用Python实现Shp格式向GeoJSON的转换方法
2019/07/09 Python
python读取Kafka实例
2019/12/23 Python
用python解压分析jar包实例
2020/01/16 Python
Python爬虫库BeautifulSoup的介绍与简单使用实例
2020/01/25 Python
PyQt5 界面显示无响应的实现
2020/03/26 Python
浅谈Python 命令行参数argparse写入图片路径操作
2020/07/12 Python
中国最大的名表商城:万表网
2016/08/29 全球购物
蒂芙尼澳大利亚官方网站:Tiffany&Co. Australia
2017/08/27 全球购物
联想香港官方网站及网店:Lenovo香港
2018/04/13 全球购物
保险专业大学生职业规划书
2014/03/03 职场文书
学校教师读书活动总结
2014/07/08 职场文书
教你如何用python开发一款数字推盘小游戏
2021/04/14 Python