<!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. Windows内存管理-分段

    0x01原因 分段的产生原属于安全问题. 一个程序可以自由的访问不属于它的内存位置,甚至可以对那些内容进行修改.这也导致安全问题 促使一种内存隔离的手段 分段的产生. 0x02分段原理 处理器要求在加 ...

  2. Mysql的基操

    创建一个数据库   (myschool是数据库名) create database myschool; 删除数据库 drop database myschool 创建一个表:(Student是 表名) ...

  3. Redis持久化 aof和rdb的原理配置

    目录 一.介绍 二.RDB持久化(全量写入) rdb原理 rdb模式 rdb触发情况 rdb优势和劣势 rdb文件配置 rdb命令配置 rdb数据恢复 三.AOF持久化(增量写入) aof原理 aof ...

  4. 【antd】表单-单页面多表单提交功能

    需求:多个表单,我想一起校验一起提交,比如这里的上下两个部分为两个组件,两个form表单 功能点:1.所有报表需通过校验 2.通过校验后提交并带入所有参数 核心问题:form表单的validateFi ...

  5. [BUUCTF]REVERSE——[MRCTF2020]Xor

    [MRCTF2020]Xor 附件 步骤: 例行检查,32位程序,无壳 32位ida载入,首先检索程序里的字符串,根据字符串的提示,跳转到程序的关键函数 根据flag,跳转到sub_401090函数 ...

  6. Table.ReplaceValue替换…Replace…(Power Query 之 M 语言)

    数据源: 任意数据源,包括文本和非文本两列 目标: 对数据进行替换操作 操作过程: [主页](或[转换])>[替换值] M公式: = Table.ReplaceValue( 表, 查找值, 替换 ...

  7. ACwing1208. 翻硬币

    题目: 小明正在玩一个"翻硬币"的游戏. 桌上放着排成一排的若干硬币.我们用 * 表示正面,用 o 表示反面(是小写字母,不是零). 比如,可能情形是:**oo***oooo 如果 ...

  8. JS使用html()获取html代码获取不到input、textarea控件填写的值

    我们可以重写一个方法 (function ($) { var oldHTML = $.fn.html; $.fn.formhtml = function () { if (arguments.leng ...

  9. IDEA安装vue.js插件后,new没有Vue component

    首先要安装vue相关的插件vue.js 但是很多人安装vue.js右键发现没有vue Componment,解决方法如下 Settings>Editor>File and Code Tem ...

  10. 【LeetCode】886. Possible Bipartition 解题报告(Python)

    [LeetCode]886. Possible Bipartition 解题报告(Python) 作者: 负雪明烛 id: fuxuemingzhu 个人博客: http://fuxuemingzhu ...