JavaScript 随机验证码的生成实例代码


Posted in Javascript onSeptember 22, 2016

随机验证码的生成

1: 主体部分

<script> 
 var code ; //在全局 定义验证码 
function createCode() 
   {  
    code = ""; 
    var codeLength = 6;//验证码的长度 
    var checkCode = document.getElementById("checkCode"); 
    var selectChar = new Array(0,1,2,3,4,5,6,7,8,9,'A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R','S','T','U','V','W','X','Y','Z');//所有候选组成验证码的字符,当然也可以用中文的 
     
    for(var i=0;i<codeLength;i++) 
    { 
    
     
    var charIndex = Math.floor(Math.random()*36); 
    code +=selectChar[charIndex]; 
     
     
    } 
//    alert(code); 
    if(checkCode) //这里不是很懂,有高手可以解释下 
    { 
     checkCode.className="code"; 
     checkCode.value = code; 
    } 
     
   } 
    
function validate () 
   { 
    var inputCode = document.getElementById("input1").value; 
    if(inputCode.length <=0) 
    { 
      alert("请输入验证码!"); 
      document.getElementById("input1").focus(); 
    } 
    else if(inputCode != code ) 
    { 
     alert("验证码输入错误!"); 
     createCode();//刷新验证码 
     inputCode = ""; 
     document.getElementById("input1").focus(); 
    }else{ 
      document.frmRegister.submit(); 
    } 
     
     
    } 
<script>

接下来时如何放入到验证框里面了

<input type="text"  id="checkCode" class="unchanged" style="width: 80px"  readonly/>  

 接着就是判断了

<input  type="text"  onclick="createCode()" id="input1" />   

OK....搞定...这里的onclik是只要动了就移开

以上就是JS 随机生成验证码的资料整理,后续继续补充相关资料,谢谢大家对本站的支持!

Javascript 相关文章推荐
JQUERY dialog的用法详细解析
Dec 19 Javascript
JQuery中$(document)是什么意思有什么作用
Jul 21 Javascript
Javascript快速排序算法详解
Dec 03 Javascript
jQuery simpleModal插件的使用介绍
Aug 30 Javascript
基于JavaScript实现无缝滚动效果
Jul 21 Javascript
Vue组件模板形式实现对象数组数据循环为树形结构(实例代码)
Jul 31 Javascript
基于canvas粒子系统的构建详解
Aug 31 Javascript
在 Node.js 中使用 async 函数的方法
Nov 17 Javascript
vue 2.8.2版本配置刚进入时候的默认页面方法
Sep 21 Javascript
vue实现文字加密功能
Sep 27 Javascript
JavaScript利用键盘码控制div移动
Mar 19 Javascript
微信小程序吸底区域适配iPhoneX的实现
Apr 09 Javascript
D3.js实现雷达图的方法详解
Sep 22 #Javascript
javascript函数中的3个高级技巧
Sep 22 #Javascript
JavaScript省市区三级联动菜单效果
Sep 21 #Javascript
Angular2 环境配置详细介绍
Sep 21 #Javascript
JS实现鼠标滑过显示边框的菜单效果
Sep 21 #Javascript
JS 动态判断PC和手机浏览器实现代码
Sep 21 #Javascript
详解AngularJs中$resource和restfu服务端数据交互
Sep 21 #Javascript
You might like
抓取YAHOO股票报价的类
2009/05/15 PHP
PHP之COOKIE支持详解
2010/09/20 PHP
PHP大小写问题:函数名和类名不区分,变量名区分
2013/06/17 PHP
javascript编程起步(第六课)
2007/01/10 Javascript
JavaScript中为元素加上name属性的方法
2011/05/09 Javascript
利用浏览器全屏api实现js全屏
2014/01/16 Javascript
浅谈js中test()函数在正则中的使用
2016/08/19 Javascript
JavaScript制作颜色反转小游戏
2016/09/25 Javascript
javascript 内置对象及常见API详细介绍
2016/11/01 Javascript
ES6新特性八:async函数用法实例详解
2017/04/21 Javascript
原生JS实现不断变化的标签
2017/05/22 Javascript
JS失效 提示HTML1114: (UNICODE 字节顺序标记)的代码页 utf-8 覆盖(META 标记)的冲突的代码页 utf-8
2017/06/23 Javascript
微信小程序之网络请求简单封装实例详解
2017/06/28 Javascript
常用的9个JavaScript图表库详解
2017/12/19 Javascript
vue-router 实现导航守卫(路由卫士)的实例代码
2018/09/02 Javascript
详解angular2 控制视图的封装模式
2018/12/27 Javascript
Node使用Selenium进行前端自动化操作的代码实现
2019/10/10 Javascript
0基础学习前端开发的一些建议
2020/07/14 Javascript
VueCli生产环境打包部署跨域失败的解决
2020/11/13 Javascript
[04:02]DOTA2上海特锦赛小组赛第二日recap精彩回顾
2016/02/28 DOTA
python算法学习之计数排序实例
2013/12/18 Python
python如何实现异步调用函数执行
2019/07/08 Python
简单了解python数组的基本操作
2019/11/26 Python
Python pyautogui模块实现鼠标键盘自动化方法详解
2020/02/17 Python
详解scrapy内置中间件的顺序
2020/09/28 Python
利用css3 translate完美实现表头固定效果
2017/02/28 HTML / CSS
英国领先的运动物理治疗供应公司:Vivomed
2018/07/14 全球购物
自考自我鉴定范文
2013/10/30 职场文书
优秀英语专业毕业生求职信
2013/11/23 职场文书
学习雷锋活动总结
2014/04/29 职场文书
爱与责任演讲稿
2014/05/20 职场文书
七年级上册语文教学计划
2015/01/22 职场文书
质检员岗位职责
2015/02/03 职场文书
个人先进事迹总结
2015/02/26 职场文书
2015年安康杯竞赛活动总结
2015/03/26 职场文书
四群教育工作总结
2015/08/10 职场文书