在写注册页面时，有时候需要发送注册邮件来获取验证码，但是为了防止多次重复发送邮件，

必须让按钮隔一段时间后才能再次使用。

代码如下：

 <html>

 <head>

 <meta charset="utf-8">

 <title>验证码按钮</title>

 </head>

 <body>

     <button type="button" id="send">发送验证码</button>

     <script type="text/javascript">

         wait = 60;

         function wait_time(btn) {

             if (wait == 0) {

                 btn.removeAttribute("disabled");

                 btn.innerText = "发送验证码";

                 wait = 60;

             } else {

                 btn.setAttribute("disabled", true);

                 btn.innerText = wait+"秒后重新发送";

                 wait--;

                 setTimeout(function(){wait_time(btn);},1000);

             }

         }

     document.getElementById('send').onclick = function(){wait_time(this)};

     </script>

 </body>

 </html>

js实现发送验证码倒计时按钮的更多相关文章

  1. js&jq 发送验证码倒计时

    <input  type="text"   name=''  id="btn"> //发送验证码倒计时var wait=30; function t ...

  2. js实现发送验证码倒计时效果

    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. jQuery 发送验证码倒计时按钮 复制代码

    <!DOCTYPE html> <html> <head> <title></title> <script src="../ ...

  4. jQuery 发送验证码倒计时按钮

    { wait:90, hsTime:function(that){ if (this.wait == 0) { $('#hsbtn').removeAttr("disabled") ...

  5. jQuery实现的手机发送验证码倒计时效果代码分享

    这是一款基于jquery实现的手机发送验证码倒计时效果代码,可实现实时显示秒数倒计时的功能,还可实现对手机号码格式验证的功能,是一款常用的网站注册发送手机验证码特效代码. 效果描述:注册一个网站,当需 ...

  6. iOS 短信验证码倒计时按钮的实现

    验证码倒计时按钮的应用是非常普遍的,本文介绍了IOS实现验证码倒计时功能,点击获取验证码,进入时间倒计时,感兴趣的小伙伴们可以参考一下: 实现思路: 创建按钮,添加点击方法: 用NSTimer定时器, ...

  7. react native中的聊天气泡以及timer封装成的发送验证码倒计时

    今天看来情书写的文章,研究了一下大佬写的文章,自己做一点总结. 其实,今天我想把我近期遇到的坑都总结一下:1.goBack的跨页面跳转,又两种方法,一可以像兔哥那样修改navigation源码,二可以 ...

  8. 原生 JS 实现手机验证码倒计时

    可以使用 pointer-events 来阻止元素成为鼠标事件的 target.html5 新增操作元素 class 类名的方式 classList. classList 方法 add(value): ...

  9. js 发送验证码倒计时

    首先写一个按钮: <input type="button" id="btn" value="免费获取验证码" onclick=&quo ...

随机推荐

  1. Binder in Java

    Android在Native层实现了进程间的Binder通信,但是上层应用程序的开发及Framework的实现都是Java,用Java层再实现一次肯定是不合理的,Java可以通过JNI调用Native ...

  2. 常用的Webpack配置

    官方文档: http://webpack.github.io/docs/ 1. 安装python2. 安装node.js msi3. npm自动打包在最新的node.js安装包里 被封的包用国内镜像下 ...

  3. GroupData群数据库的还原与优化

    一.背景 这个数据库的数据文件mdf大概有83G左右,当还原数据库之后感觉可以做很多性能方面上的调优,合并数据后mdf数据文件大概有59G左右,行压缩后mdf数据文件大概有39G左右,页压缩后mdf数 ...

  4. 【Win 10 应用开发】导入.pfx证书

    这个功能其实并不常用,一般开发较少涉及到证书,不过,简单了解一下还是有必要的. 先来说说制作测试证书的方法,这里老周讲两种方法,可以生成用于测试的.pfx文件. 产生证书,大家都知道有个makecer ...

  5. 【.NET深呼吸】动态类型（扩充篇）

    前面两文中,老周已向大家介绍了关于动态类型对象的两种级别的使用方案,本篇呢,老周再讲一个自定义动态类型的例子. 前面给大家演示的例子中,动态类型中包装的是字典类型来存储数据的,这一次咱们换一种风味,老 ...

  6. Git(最基本使用远程仓库:github)-V1.0

    所有操作的根目录是:D:/zqzGit文件夹,这个目录也是git仓库 git bash清屏  clear  1.安装(略)  2.安装后记得配置: $ git config --global user ...

  7. 【JAVA框架】Hibernate 与Mybatis 区别

    Hibernate Mybatis 简介 区别 与联系 欢迎提出见解及转载. 1 简单简介     1.1    Hibernate 框架          Hibernate是一个开放源代码的对象关 ...

  8. 理清JavaScript正则表达式--下篇

    紧接:"理清JavaScript正则表达式--上篇". 正则在String类中的应用 类String支持四种利用正则表达式的方法.分别是search.replace.match和s ...

  9. CSS3伸缩盒Flexible Box

    这是一种全新的布局,在移动端非常实用,IE对此布局的相关的兼容不是很好,Firefox.Chrome.Safrai等需要加浏览器前缀. 先说说这种布局的特点: 1)移动端由于屏幕宽度都不一样,在布局的 ...

  10. ASP.NET Core 中文文档 第三章 原理（3）静态文件处理

    原文:Working with Static Files 作者:Rick Anderson 翻译:刘怡(AlexLEWIS) 校对:谢炀(kiler398).许登洋(Seay).孟帅洋(书缘) 静态文 ...