<!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. 阿里云esc 安装 docker

    1. 更新 yum 到最新: yum update (用 root 用户登录,无需加 sudo,如果不是,需要加,即  yum update ) 2. 安装软件包:yum-util(提供 yum-co ...

  2. java实现文件压缩

    java实现文件压缩:主要是流与流之间的传递 代码如下: package com.cst.klocwork.service.zip; import java.io.File; import java. ...

  3. request.getRequestDispatcher()和response.sendRedirect()区别

    一.request.getRequestDispatcher().forward(request,response): 1.属于转发,也是服务器跳转,相当于方法调用,在执行当前文件的过程中转向执行目标 ...

  4. myfs 操作系统课内实验 文件管理系统 Ext2

    To 学弟学妹们: 写这个随笔原意是记录一下这个很有趣的实验 ,记录一下写的时候的细节和思路. 要是光是抄这个代码,反而使得这个实验失去了意义. 加油,这个实验收获真的很大. 任务描述: 用一个空白文 ...

  5. 安全刻不容缓「GitHub 热点速览 v.21.50」

    作者:HelloGitHub-小鱼干 本周最热的事件莫过于 Log4j 漏洞,攻击者仅需向目标输入一段代码,不需要用户执行任何多余操作即可触发该漏洞,使攻击者可以远程控制用户受害者服务器,90% 以上 ...

  6. $(document).ready()与window.onload的区别，站在三个维度回答问题

    1.执行时机 window.onload必须等到页面内包括图片的所有元素加载完毕后才能执行.         $(document).ready()是DOM结构绘制完毕后就执行,不必等到加载完毕. 2 ...

  7. Redis增加测试数据

    目录 一.简介 二.操作 三.制造测试数据 一.简介 用shell脚本将文本内容挨个写到redis中效率是很慢的.打开一个链接,写入后再关闭,再打开,效率很低. redis支持pipe mode功能, ...

  8. rpm-build方式制作rpm包

    目录 一.简介 二.具体操作 一.简介 可以将编译完成的服务打成rpm包放到私有仓库了,用于自定义的各种软件进行安装部署配置. 二.具体操作 1.安装软件,这个命令将构建rpm包 yum -y ins ...

  9. js实现数组扁平化

    数组扁平化的方式 什么是数组扁平化? 数组扁平化:指将一个多维数组转化为一个一维数组. 例:将下面数组扁平化处理. const arr = [1, [2, 3, [4, 5]]] // ---> ...

  10. LuoguB2103 图像相似度 题解

    Content 给定两个 \(m\times n\) 的矩阵 \(A,B\),求 \(A,B\) 两个矩阵的相似度,精确到小数点后 \(2\) 位. 定义两个矩阵的相似度为两个矩阵对应相同元素个数占矩 ...