基于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 相关文章推荐
在线编辑器中换行与内容自动提取
Apr 24 Javascript
同一个表单 根据要求递交到不同页面的实现方法小结
Aug 05 Javascript
javascript 动态生成私有变量访问器
Dec 06 Javascript
js阻止冒泡及jquery阻止事件冒泡示例介绍
Nov 19 Javascript
jQuery仿淘宝网产品品牌隐藏与显示效果
Sep 01 Javascript
js绘制购物车抛物线动画
Nov 18 Javascript
JavaScript30 一个月纯 JS 挑战中文指南(英文全集)
Jul 23 Javascript
jQuery实现的手动拖动控制进度条效果示例【测试可用】
Apr 18 jQuery
JavaScript事件冒泡与事件捕获实例分析
Aug 01 Javascript
vue文件运行的方法教学
Feb 12 Javascript
浅谈对于react-thunk中间件的简单理解
May 01 Javascript
js实现批量删除功能
Aug 27 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实现的zip文件内容比较类
2014/09/24 PHP
PHP测试成功的邮件发送案例
2015/10/26 PHP
PHP实现简单注册登录系统
2020/12/28 PHP
Javascript 跨域访问解决方案
2009/02/14 Javascript
Jquery升级新版本后选择器的语法问题
2010/06/02 Javascript
js动态生成指定行数的表格
2013/07/11 Javascript
JavaScript var声明变量背后的原理示例解析
2013/10/12 Javascript
JS+JSP checkBox 全选具体实现
2014/01/02 Javascript
jquery实现手机发送验证码的倒计时代码
2014/02/12 Javascript
Javascript单元测试框架QUnitjs详细介绍
2014/05/08 Javascript
jQuery实现“扫码阅读”功能
2015/01/21 Javascript
浅谈JavaScript中Date(日期对象),Math对象
2015/02/05 Javascript
MVC+jQuery.Ajax异步实现增删改查和分页
2020/12/22 Javascript
jQuery简单实现iframe的高度根据页面内容自适应的方法
2016/08/01 Javascript
jQuery实现两列等高并自适应高度
2016/12/22 Javascript
bootstrap treeview 扩展addNode方法动态添加子节点的方法
2017/11/21 Javascript
Vue render深入开发讲解
2018/04/13 Javascript
js+css实现全屏侧边栏
2020/06/16 Javascript
uni-app实现获取验证码倒计时功能
2020/11/01 Javascript
WebStorm无法正确识别Vue3组合式API的解决方案
2021/02/18 Vue.js
Python3.4实现从HTTP代理网站批量获取代理并筛选的方法示例
2017/09/26 Python
用Python实现KNN分类算法
2017/12/22 Python
Python将json文件写入ES数据库的方法
2019/04/10 Python
python实现人机猜拳小游戏
2020/02/03 Python
python多进程下的生产者和消费者模型
2020/05/07 Python
python mongo 向数据中的数组类型新增数据操作
2020/12/05 Python
Rowdy Gentleman服装和配饰:美好时光
2019/09/24 全球购物
自我评价怎么写正确呢?
2013/12/02 职场文书
研修第一天随笔感言
2014/02/15 职场文书
租房合同协议书
2014/04/09 职场文书
综合实践活动总结
2014/05/05 职场文书
说明书格式及范文
2014/05/07 职场文书
建设单位项目负责人任命书
2014/06/06 职场文书
幼儿园标语大全
2014/06/19 职场文书
勿忘国耻9.18演讲稿(经典篇)
2014/09/14 职场文书
2015年见习期个人工作总结
2015/05/28 职场文书