getVarify.js


// 验证码计时——第一种
window.onload = function () {
var send = document.getElementById('send'), //按钮ID
times = 10, // 别忘了改这里
timer = null;
send.onclick = function () {
// 计时开始
send.disabled = true;
timer = setInterval(function () {
times--;
if (times <= 0) {
send.value = '获取验证码';
clearInterval(timer);
times = 5; // 别忘了改这里
send.disabled = false;
} else {
send.value = times + '秒后重试'
send.disabled = true;
} console.log(times)
}, 1000);
// 发送请求获取验证码
console.log("sending...")
}
}// 验证码计时——第二种
// 参数:倒计时秒数, 按钮jquery对象, 倒计时结束时显示的文字
// 可以放到短信发送完毕后的回调函数里
// switchMSG(60, $("#get-verify"), '获取验证码')
function switchMSG(times, ele, txt) {
ele.prop('disabled', true)
var idT = setInterval(function() {
if(times < 1) {
ele.html(txt)
ele.prop('disabled', false)
clearInterval(idT)
} else {
ele.html(times+'s')
times-- }
}, 1000)
}

验证码倒计时js的更多相关文章

  1. 手机验证 发送验证码倒计时js

    html: <input name="Tel" class="weui-input" type="tel" placeholder=& ...

  2. js 验证码 倒计时60秒

    js 验证码 倒计时60秒 <input type="button" id="btn" value="免费获取验证码" /> & ...

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

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

  4. js,JQ获取短信验证码倒计时

    按钮 <a href="javasript:void(0);"onclick="settime(this);">获取手机验证码</a> ...

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

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

  6. js之验证码倒计时功能

    <!DOCTYPE html> <html > <head> <meta http-equiv="Content-Type" conten ...

  7. js点击按钮获取验证码倒计时

    //发送验证码倒计时 var clock = ''; var nums = 60; var btn; $("#btnGetVerCode").click(function () { ...

  8. js 发送短信验证码倒计时

    html <input type="button" id="btn" value="免费获取验证码" onclick="se ...

  9. jquery倒计时按钮常用于验证码倒计时

    <!doctype html><html><head> <meta charset="utf-8"> <title>jq ...

随机推荐

  1. 洛谷 P3120 [USACO15FEB]牛跳房子(金)Cow Hopscotch (Gold)

    P3120 [USACO15FEB]牛跳房子(金)Cow Hopscotch (Gold) 就像人类喜欢跳格子游戏一样,FJ的奶牛们发明了一种新的跳格子游戏.虽然这种接近一吨的笨拙的动物玩跳格子游戏几 ...

  2. promise体验

    promise的执行流程 promise串行执行异步 job1.then(job2).then(job3).catch(handleError); // 0.5秒后返回input*input的计算结果 ...

  3. linux 最新化安装后安卓 KDE 桌面

    yum -y install epel-releaseyum -y groupinstall "X Window System"yum -y groupinstall " ...

  4. SpringBoot 05_集成SpringDataJpa

    你还在为项目的集成头疼吗?你还在为管理大量的配置文件烦恼吗?如果是,用SpringBoot吧!今天主要介绍如果在SpringBoot的基础上创建一个集成了SpringDataJpa的项目,至于Spri ...

  5. linux命令补全工具

    一:下载bash-competion工具 https://files.cnblogs.com/files/zgngg/bash-completion.zip 二:解压  unzip bash-comp ...

  6. js 实现横向轮播效果

    参考:https://www.cnblogs.com/LIUYANZUO/p/5679753.html html: <!DOCTYPE html> <html> <hea ...

  7. 记录下sparkStream的做法(scala)

    一直用storm做实时流的开发,之前系统学过spark但是一直没做个模版出来用,国庆节有时间准备做个sparkStream的模板用来防止以后公司要用.(功能模拟华为日常需求,db入库hadoop环境) ...

  8. Java基础知识(面试问题1)

    1.什么是 GC?为什么要有 GC?GC(Garbage Collection)是垃圾收集的意思,负责清除对象并释放内存.Java 提供的 GC 功能可以自动检测对象是否超过作用域从而达到自动回收内存 ...

  9. 洛谷p1605--迷宫 经典dfs

    https://www.luogu.org/problemnew/show/P1605 用这种题来复习一下dfs 给定一个N*M方格的迷宫,迷宫里有T处障碍,障碍处不可通过.给定起点坐标和终点坐标,问 ...

  10. PAT甲级——A1013 Battle Over Cities

    It is vitally important to have all the cities connected by highways in a war. If a city is occupied ...