基于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 相关文章推荐
20个非常棒的Jquery实用工具 国外文章
Jan 01 Javascript
js遍历td tr等html元素
Dec 13 Javascript
基于KMP算法JavaScript的实现方法分析
May 03 Javascript
关于删除时的提示处理(确定删除吗)
Nov 03 Javascript
理解JS事件循环
Jan 07 Javascript
js严格模式总结(分享)
Aug 22 Javascript
Javascript获取图片原始宽度和高度的方法详解
Sep 20 Javascript
jquery Ajax实现Select动态添加数据
Jun 08 jQuery
微信小程序中页面FOR循环和嵌套循环
Jun 21 Javascript
详解vue2.0 资源文件assets和static的区别
Nov 27 Javascript
js实现图片无缝循环轮播
Oct 28 Javascript
jQuery实现验证用户登录
Dec 10 jQuery
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
一个SQL管理员的web接口
2006/10/09 PHP
php 验证码制作(网树注释思想)
2009/07/20 PHP
PHP5中新增stdClass 内部保留类
2011/06/13 PHP
PHP里的中文变量说明
2011/07/23 PHP
ThinkPHP2.0读取MSSQL提示Incorrect syntax near the keyword 'AS'的解决方法
2014/06/25 PHP
yii2 commands模式以及配置crontab定时任务的方法
2017/08/19 PHP
javascript 函数调用的对象和方法
2010/07/01 Javascript
window.parent与window.openner区别介绍
2012/04/12 Javascript
ajax请求get与post的区别总结
2013/11/04 Javascript
jquery获取当前点击对象的value方法
2014/02/28 Javascript
jquery通过load获取文件的内容并跳到锚点的方法
2015/01/29 Javascript
JavaScript实现九九乘法表的简单实例
2016/06/07 Javascript
AngularJS 表达式详细讲解及实例代码
2016/07/26 Javascript
AngularJS入门教程之链接与图片模板详解
2016/08/19 Javascript
localStorage实现便签小程序
2016/11/28 Javascript
js实现适合新闻类图片的轮播效果
2017/02/05 Javascript
JavaScript运动框架 链式运动到完美运动(五)
2017/05/18 Javascript
详解PHP后期静态绑定分析与应用
2018/03/21 Javascript
Vue的watch和computed方法的使用及区别介绍
2018/09/06 Javascript
[00:10]DOTA2全国高校联赛速递
2018/05/30 DOTA
[02:12]2019完美世界全国高校联赛(春季赛)报名开启
2019/03/01 DOTA
Windows平台Python连接sqlite3数据库的方法分析
2017/07/12 Python
使用Python &amp; Flask 实现RESTful Web API的实例
2017/09/19 Python
Python爬虫实现(伪)球迷速成
2018/06/10 Python
python3将视频流保存为本地视频文件
2018/06/20 Python
python读取几个G的csv文件方法
2019/01/07 Python
Python 实现中值滤波、均值滤波的方法
2019/01/09 Python
Python异常原理及异常捕捉实现过程解析
2020/03/25 Python
奥地利汽车配件店:Pkwteile.at
2017/03/10 全球购物
彪马加拿大官网:PUMA加拿大
2018/10/04 全球购物
工商管理本科毕业生求职信范文
2013/10/05 职场文书
班组安全员工作职责
2014/02/01 职场文书
美术国培研修感言
2014/02/12 职场文书
保研推荐信
2014/05/09 职场文书
WordPress多语言翻译插件 - WPML使用教程
2021/04/01 PHP
CSS 使用 resize 实现图片拖拽切换预览功能(强大功能)
2021/08/23 HTML / CSS