<!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. Servlet(2)：通过servletContext对象实现数据共享

    一,ServletContext介绍 web容器在启动时,它会为每一个web应用程序都创建一个ServletContext对象,它代表当前web应用 多个Servlet通过ServletContext ...

  2. Linux系统的负载与CPU、内存、硬盘、用户数监控的shell脚本

    利用Shell脚本来监控Linux系统的负载.CPU.内存.硬盘.用户登录数. 这几天在学习研究shell脚本,写的一些系统负载.CPU.内存.硬盘.用户数监控脚本程序.在没有nagios监控的情况下 ...

  3. apply 和 call 的区别

    相同点: 都能够改变方法的执行上下文(执行环境),将一个对象的方法交给另一个对象来执行,并且是立即执行 不同点: call方法从第二个参数开始可以接收任意个参数,每个参数会映射到相应位置的func的参 ...

  4. XML解析器

    1.非验证解析器 检查文档格式是否良好,如用浏览器打开XML文档时,浏览器会进行检查,即格式是否符合XML(可拓展标记语言)基本概念. 2.验证解析器 使用DTD(Document Type Defi ...

  5. Nginx LOCATOIN块配置

    1 匹配模式优先级 location = /uri =开头表示精确匹配,只有完全匹配上才能生效. location ^~ /uri ^~ 开头对URL路径进行前缀匹配,并且在正则之前.无正则普通匹配( ...

  6. netty系列之:一个价值上亿的网站速度优化方案

    目录 简介 本文的目标 支持多个图片服务 http2处理器 处理页面和图像 价值上亿的速度优化方案 总结 简介 其实软件界最赚钱的不是写代码的,写代码的只能叫马龙,高级点的叫做程序员,都是苦力活.那么 ...

  7. HMAC在“挑战/响应”（Challenge/Response）身份认证的应用

    HMAC的一个典型应用是用在"挑战/响应"(Challenge/Response)身份认证中. 认证流程 (1) 先由客户端向服务器发出一个验证请求. (2) 服务器接到此请求后生 ...

  8. [BUUCTF]REVERSE——[GXYCTF2019]luck_guy

    [GXYCTF2019]luck_guy 附件 步骤: ida载入,shift+f12查看程序里的字符串,看到了关于flag的提示 双击跟进跳转,ctrl+x找到关键函数 flag是由f1和f1拼接而 ...

  9. CF1108A Two distinct points 题解

    Content 有 \(q\) 次询问,每次询问给定四个数 \(l_1,r_1,l_2,r_2\).对于每次询问,找到两个数 \(a,b\),使得 \(l_1\leqslant a\leqslant ...

  10. Python+Robot Framework实现UDS诊断自动化测试

    一.环境搭建 1.概述 由于项目需要进行UDS诊断测试,所以对这方面进行了研究学习,网上很少能查询到相关资料,故记录一下UDS自动化测试开发过程,由于保密原则,案例都是Demo,希望能帮到感兴趣的朋友 ...