<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>Document</title>

</head>

<body>

    <input type="text">

    <button>发送</button>

    <script>

        //获取元素

        var btn = document.querySelector('button');

        var timer = 60;

        btn.addEventListener('click',function(){

            var tt= setInterval(function(){

            if(timer==0){

                clearInterval(tt);

                btn.disabled=false;

                btn.innerText='发送';

                timer=60;

            }else{

                btn.disabled=true;

                btn.innerText=timer+'重新发送'

                timer--;

            }

        },1000)

        })

    </script>

</body>

</html>

BOM 点击触发 倒计时发送验证码案例的更多相关文章

  1. js倒计时发送验证码按钮

    var wait=60; function time(o) { if (wait == 0) { o.removeAttribute("disabled"); o.value=&q ...

  2. Java 之 Response 发送验证码案例

    定义一个 Servlet 用来在内存中生成 二维码图片,并向浏览器页面输出. import javax.imageio.ImageIO; import javax.servlet.ServletExc ...

  3. 发送验证码60s倒计时实现

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

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

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

  5. 微信小程序发送验证码功能，验证码倒计时

    data{ timer:'', countDownNum:'发送验证码', } // 点击验证码倒计时获取验证码 Gain:function(e){ let that = this let count ...

  6. 【积累】发送验证码按钮倒计时js

    注册的时候要发送验证码,就上网研究了一下,写了一个简单点的... jsp页面: <input type="button" id="testbtn" val ...

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

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

  8. jQuery实现发送验证码倒计时60秒

    前端HMTL: <div class="form_box"> <div class="line mb40"> <div class ...

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

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

随机推荐

  1. error信息

    /opt/hadoop/src/contrib/eclipse-plugin/build.xml:61: warning: 'includeantruntime' was not set, defau ...

  2. Private Destructor

    Predict the output of following programs. 1 #include <iostream> 2 using namespace std; 3 4 cla ...

  3. matplotlib 坐标轴刻度能见度问题

    matplotlib 画图时如果图像太大就会挡住了坐标轴,刻度就看不到了.可以利用zorder设置level,level越小越先绘制. 例子: 1 import matplotlib.pyplot a ...

  4. jenkins实例 nodejs项目

    目录 一.案例1 二.案例2 一.案例1 使用shell方式 #清理上一次版本,拉取新代码 rm -rf /server/admin-web cd /server git clone http://g ...

  5. ubuntu 16.04下的fastadmin安装指南

    此篇博客转载于fastadmin论坛,方便自己看转到了博客里 说明文档不多,特制作一个,方便大家交流使用Ubuntu 16.04 安装fastadmin指南本文因考虑到大多数人员,习惯性在window ...

  6. ios self.和_区别

    - "self."调用该类的setter或getter方法,"_"直接获取自己的实例变量.property 和 instance variable 是有区别的. ...

  7. 多个工作簿拆分（Excel代码集团）

    一个文件夹里有N个工作簿,每个工作簿中包括N个工作表,将各个工作表拆分成工作簿,命名为每个工作簿里第一个工作表的A列和B列. 工作簿.工作表数量不定,表内内容不限,拆分后保存于当前文件夹下的" ...

  8. 摘要任务工期计算（Project）

    <Project2016 企业项目管理实践>张会斌 董方好 编著 先说一个好消息:摘要工期是可以自动计算的. 比如A1.A2.A3.A4四个任务,工期如下图安排: 而他们的摘要任务,就不再 ...

  9. DKT模型及其TensorFlow实现（Deep knowledge tracing with Tensorflow）

    今年2月15日,谷歌举办了首届TensorFlow Dev Summit,并且发布了TensorFlow 1.0 正式版. 3月18号,上海的谷歌开发者社区(GDG)组织了针对峰会的专场回顾活动.本文 ...

  10. 使用docker-compose一起安装kafka（zookeeper）

    要先安装docker-compose Linux安装docker-compose 参考:https://www.cnblogs.com/pxblog/p/15049362.html 创建docker- ...