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 相关文章推荐
利用404错误页面实现UrlRewrite的实现代码
Aug 20 Javascript
jquery隐藏标签和显示标签的实例
Nov 11 Javascript
为Javascript中的String对象添加去除左右空格的方法(示例代码)
Nov 30 Javascript
jQuery使用before()和after()在元素前后添加内容的方法
Mar 26 Javascript
js实现select跳转菜单新窗口效果代码分享(超简单)
Aug 21 Javascript
javascript Slip.js实现整屏滑动的手机网页
Nov 25 Javascript
js实现兼容IE、Firefox的图片缩放代码
Dec 08 Javascript
javaScript实现鼠标在文字上悬浮时弹出悬浮层效果
Apr 12 Javascript
js常见遍历操作小结
Jun 06 Javascript
vuex + keep-alive实现tab标签页面缓存功能
Oct 17 Javascript
浅谈vuex中store的命名空间
Nov 08 Javascript
js实现鼠标切换图片(无定时器)
Jan 27 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也能干大事 随机函数
2015/04/14 PHP
Laravel框架实现的使用smtp发送邮件功能示例
2019/03/12 PHP
PHP SESSION跨页面传递失败解决方案
2020/12/11 PHP
Js组件的一些写法
2010/09/10 Javascript
jquery监听div内容的变化具体实现思路
2013/11/04 Javascript
js锁屏解屏通过对$.ajax进行封装实现
2014/07/31 Javascript
学习使用grunt来打包JavaScript和CSS程序的教程
2016/01/04 Javascript
jQuery表单插件ajaxForm实例详解
2017/01/17 Javascript
微信JS SDK接入的几点注意事项(必看篇)
2017/06/23 Javascript
详解用vue编写弹出框组件
2017/07/04 Javascript
jQuery插件artDialog.js使用与关闭方法示例
2017/10/09 jQuery
js实现各浏览器全屏代码实例
2018/07/03 Javascript
对angularJs中ng-style动态改变样式的实例讲解
2018/09/30 Javascript
浅析webpack-bundle-analyzer在vue-cli3中的使用
2019/10/23 Javascript
js代码编写无缝轮播图
2020/09/13 Javascript
Python编程实现使用线性回归预测数据
2017/12/07 Python
对python中Librosa的mfcc步骤详解
2019/01/09 Python
Python音频操作工具PyAudio上手教程详解
2019/06/26 Python
python实现引用其他路径包里面的模块
2020/03/09 Python
python实现人机五子棋
2020/03/25 Python
药学专业个人自我评价
2013/11/11 职场文书
学校门卫工作职责
2013/12/07 职场文书
粗加工管理制度
2014/02/04 职场文书
大学生个人实习的自我评价
2014/02/15 职场文书
潘婷洗发水广告词
2014/03/14 职场文书
班主任寄语大全
2014/04/04 职场文书
市场开发与营销专业求职信范文
2014/05/01 职场文书
领导干部群众路线教育实践活动剖析材料
2014/10/10 职场文书
购房委托书
2014/10/15 职场文书
2014年乡镇个人工作总结
2014/12/03 职场文书
2015年家长学校工作总结
2015/04/22 职场文书
英雄儿女观后感
2015/06/09 职场文书
《水浒传》读后感3篇(范文)
2019/09/19 职场文书
CocosCreator如何实现划过的位置显示纹理
2021/04/14 Javascript
Golang并发操作中常见的读写锁详析
2021/08/30 Golang
Python实现聚类K-means算法详解
2022/07/15 Python