JS验证不重复验证码


Posted in Javascript onFebruary 10, 2017

话不多说,请看代码:

<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <title>不重复验证码</title>
 <style>
  .cont{width:300px;height:auto;margin:50px auto;}
    #useId{width:120px;height:45px;line-height:45px;background:#ccc;text-align:center;font-size:20px;margin:10px;}
 </style>
</head>
<body>
 <div class="cont">
 <div id="useId"></div>
 <input type="text" id="txt" />
 <input type="button" id="btn" value="Start" />
 <div>
 <script>
    function $(id){
     return document.getElementById(id);
    }
    var $useId = $('useId'),
      $txt = $('txt'),
      $btn = $('btn');
    function getStr(){
    var string = 'abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789',
      str = '';
      while(str.length < 6){
     var str1 = string.charAt(Math.round(Math.random() * 56));
     if(str.indexOf(str1) === -1){
      str += str1;
     }
    }
    $useId.innerHTML = str;
    }
    function checkCode(){
     if($txt.value == $useId.innerHTML){
     alert('验证成功');
     }else{
     alert('验证失败');
     }
    }
    $useId.onclick = getStr;
    $btn.onclick = checkCode;
 </script>
</body>
</html>

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持三水点靠木!

Javascript 相关文章推荐
常用参考资料(手册)下载或者链接
Jul 22 Javascript
JScript内置对象Array中元素的删除方法
Mar 08 Javascript
通用javascript脚本函数库 方便开发
Oct 13 Javascript
JavaScript DOM学习第一章 W3C DOM简介
Feb 19 Javascript
23个超流行的jQuery相册插件整理分享
Apr 25 Javascript
JS预览图像将本地图片显示到浏览器上
Aug 25 Javascript
获取下拉列表框的值是数组,split,$.inArray示例
Nov 13 Javascript
Javascript获取表单名称(name)的方法
Apr 02 Javascript
js实现拉幕效果的广告代码
Sep 02 Javascript
vue-router:嵌套路由的使用方法
Feb 21 Javascript
Vue组件tree实现树形菜单
Apr 13 Javascript
简单了解Javscript中兄弟ifream的方法调用
Jun 17 Javascript
使用jquery给新生的th绑定hover事件的实例
Feb 10 #Javascript
详谈Ajax请求中的async:false/true的作用(ajax 在外部调用问题)
Feb 10 #Javascript
jQuery移除或禁用html元素点击事件常用方法小结
Feb 10 #Javascript
jQuery基于Ajax方式提交表单功能示例
Feb 10 #Javascript
Bootstrap轮播图学习使用
Feb 10 #Javascript
微信小程序模板之分页滑动栏
Feb 10 #Javascript
三种方式实现瀑布流布局
Feb 10 #Javascript
You might like
PHP与SQL注入攻击[二]
2007/04/17 PHP
php 解决旧系统 查出所有数据分页的类
2012/08/27 PHP
PHP+ajaxfileupload+jcrop插件完美实现头像上传剪裁
2014/06/09 PHP
php简单定时执行任务的实现方法
2015/02/23 PHP
Dojo之路:如何利用Dojo实现Drag and Drop效果
2007/04/10 Javascript
Javascript执行效率全面总结
2013/11/04 Javascript
Jquery解析json数据详解
2013/12/26 Javascript
在Javascript中处理数组之toSource()方法的使用
2015/06/09 Javascript
javascript制作幻灯片(360度全景图片)
2015/07/28 Javascript
果断收藏9个Javascript代码高亮脚本
2016/01/06 Javascript
javascript小数精度丢失的完美解决方法
2016/05/31 Javascript
浅谈MVC+EF easyui dataGrid 动态加载分页表格
2016/11/10 Javascript
Vue Cli与BootStrap结合实现表格分页功能
2017/08/18 Javascript
nodejs 图片预览和上传的示例代码
2017/09/30 NodeJs
vue-cli启动本地服务局域网不能访问的原因分析
2018/01/22 Javascript
Node.JS段点续传:Nginx配置文件分段下载功能的实现方法
2018/03/12 Javascript
JS+CSS3实现的简易钟表效果示例
2019/04/13 Javascript
vue 中Virtual Dom被创建的方法
2019/04/15 Javascript
详解JS深拷贝与浅拷贝
2020/08/04 Javascript
Vue.extend 登录注册模态框的实现
2020/12/29 Vue.js
pyqt5利用pyqtDesigner实现登录界面
2019/03/28 Python
详解Python匿名函数(lambda函数)
2019/04/19 Python
Pytorch Tensor的统计属性实例讲解
2019/12/30 Python
sklearn+python:线性回归案例
2020/02/24 Python
python中rc1什么意思
2020/06/19 Python
Missguided美国官网:英国时尚品牌
2018/01/18 全球购物
在对linux系统分区进行格式化时需要对磁盘簇(或i节点密度)的大小进行选择,请说明选择的原则
2012/01/13 面试题
医学院毕业生自荐信
2013/11/08 职场文书
英语教师求职信
2014/06/16 职场文书
节能减耗标语
2014/06/21 职场文书
2015暑假实习报告范文
2015/07/13 职场文书
2015年物流客服工作总结
2015/07/27 职场文书
新西兰:最新留学学习计划书写作指南
2019/07/15 职场文书
节约用水广告语60条
2019/11/14 职场文书
Python基础之条件语句详解
2021/06/16 Python
一篇文章带你了解Python和Java的正则表达式对比
2021/09/15 Python