基于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 相关文章推荐
Eval and new funciton not the same thing
Dec 27 Javascript
JQuery中如何传递参数如click(),change()等具体实现
Apr 28 Javascript
Angular的自定义指令以及实例
Dec 26 Javascript
js 颜色选择插件
Jan 23 Javascript
react-router中的属性详解
Jun 01 Javascript
vue.js实现只弹一次弹框
Jan 29 Javascript
Angularjs实现页面模板清除的方法
Jul 20 Javascript
Vue2实时监听表单变化的示例讲解
Aug 30 Javascript
jquery实现联想词搜索框和搜索结果分页的示例
Oct 10 jQuery
使用layui+ajax实现简单的菜单权限管理及排序的方法
Sep 10 Javascript
vue.js实现双击放大预览功能
Jun 23 Javascript
在vue中使用vant TreeSelect分类选择组件操作
Nov 02 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
mysql5写入和读出乱码解决
2006/11/25 PHP
php获取twitter最新消息的方法
2015/04/14 PHP
php去除二维数组的重复项方法
2015/11/03 PHP
EasyUi tabs的高度与宽度根据IE窗口的变化自适应代码
2010/10/26 Javascript
用Jquery选择器计算table中的某一列某一行的合计
2014/08/13 Javascript
Javascript学习指南
2014/12/01 Javascript
node.js中的fs.openSync方法使用说明
2014/12/17 Javascript
jQuery的animate函数实现图文切换动画效果
2015/05/03 Javascript
鼠标经过子元素触发mouseout,mouseover事件的解决方案
2015/07/26 Javascript
在JavaScript中使用JSON数据
2016/02/15 Javascript
jQuery联动日历的实例解析
2016/12/02 Javascript
Vue.js 递归组件实现树形菜单(实例分享)
2016/12/21 Javascript
JavaScript数组迭代方法
2017/03/03 Javascript
详解Angular2 关于*ngFor 嵌套循环
2017/05/22 Javascript
详解VUE 数组更新
2017/12/16 Javascript
echarts实现地图定时切换散点与多图表级联联动详解
2018/08/07 Javascript
bootstrap 日期控件 datepicker被弹出框dialog覆盖的解决办法
2019/07/09 Javascript
jquery插件实现轮播图效果
2020/10/19 jQuery
vue 判断页面是首次进入还是再次刷新的实例
2020/11/05 Javascript
Python如何import文件夹下的文件(实现方法)
2017/01/24 Python
Python操作Excel之xlsx文件
2017/03/24 Python
python购物车程序简单代码
2018/04/18 Python
Django Web开发中django-debug-toolbar的配置以及使用
2018/05/06 Python
Python预测2020高考分数和录取情况
2020/07/08 Python
Python urllib request模块发送请求实现过程解析
2020/12/10 Python
如何用用Python将地址标记在地图上
2021/02/07 Python
印度最大的时尚购物网站:Myntra
2018/09/13 全球购物
系统管理员的职责包括那些?管理的对象是什么?
2013/01/18 面试题
自荐书封面下载
2013/11/29 职场文书
心理健康心得体会
2014/01/02 职场文书
英语一分钟演讲稿
2014/04/29 职场文书
沙滩主题婚礼活动策划方案
2014/09/15 职场文书
英语四级考试作弊检讨书
2014/09/29 职场文书
2014年公务员转正工作总结
2014/11/07 职场文书
2014年纪检部工作总结
2014/11/12 职场文书
班主任寄语2015
2015/02/26 职场文书