验证码倒计时js
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的更多相关文章
- 手机验证 发送验证码倒计时js
html: <input name="Tel" class="weui-input" type="tel" placeholder=& ...
- js 验证码 倒计时60秒
js 验证码 倒计时60秒 <input type="button" id="btn" value="免费获取验证码" /> & ...
- js&jq 发送验证码倒计时
<input type="text" name='' id="btn"> //发送验证码倒计时var wait=30; function t ...
- js,JQ获取短信验证码倒计时
按钮 <a href="javasript:void(0);"onclick="settime(this);">获取手机验证码</a> ...
- 原生 JS 实现手机验证码倒计时
可以使用 pointer-events 来阻止元素成为鼠标事件的 target.html5 新增操作元素 class 类名的方式 classList. classList 方法 add(value): ...
- js之验证码倒计时功能
<!DOCTYPE html> <html > <head> <meta http-equiv="Content-Type" conten ...
- js点击按钮获取验证码倒计时
//发送验证码倒计时 var clock = ''; var nums = 60; var btn; $("#btnGetVerCode").click(function () { ...
- js 发送短信验证码倒计时
html <input type="button" id="btn" value="免费获取验证码" onclick="se ...
- jquery倒计时按钮常用于验证码倒计时
<!doctype html><html><head> <meta charset="utf-8"> <title>jq ...
随机推荐
- E. Present for Vitalik the Philatelist 反演+容斥
题意:给n个数\(a_i\),求选一个数x和一个集合S不重合,gcd(S)!=1,gcd(S,x)==1的方案数. 题解:\(ans=\sum_{i=2}^nf_ig_i\),\(f_i\)是数组中和 ...
- JavaScrip中的循环语句
循环语句 循环语句,也是流程控制语句中不可或缺的一种结构.在 JavaScrip中实现循环的方式有好几个一个来看 1.为什么需要循环 在具体介绍 Javascript中的循环之前,首先我们来明确一个问 ...
- memcache课程---2、php如何操作memcache
memcache课程---2.php如何操作memcache 一.总结 一句话总结: windows下装好memcache.exe,装好memcache的php扩展之后,然后使用memcache函数库 ...
- kubeadm安装Kubernetes 1.15 实践
原地址参考github 一.环境准备(在全部设备上进行) 3 台 centos7.5 服务器,网络使用 Calico. IP地址 节点角色 CPU 内存 Hostname 10.0.1.45 mast ...
- Java(8)中List的遍历方式总结
本篇文章主要讲述了List这一集合类型在Java,包括Java8中的遍历方式,不包括其他的过滤,筛选等操作,这些操作将会在以后的文章中得到提现,由List可以类推到Set等类似集合的遍历方式. pub ...
- Struts2OGNL
OGNL: 什么是OGNL Object Graph Navigation Language 开源项目,取代页面中Java脚本,简化数据访问 和EL同属于表达式语言,但功能更为强大 OGNL在St ...
- 2019-8-31-C#-已知点和向量,求距离的点
title author date CreateTime categories C# 已知点和向量,求距离的点 lindexi 2019-08-31 16:55:58 +0800 2018-05-08 ...
- 如何做系列(4)-微博URL短网址生成算法原理(java版、php版实现实例)
短网址(Short URL),顾名思义就是在形式上比较短的网址.通常用的是asp或者php转向,在Web 2.0的今天,不得不说,这是一个潮流.目前已经有许多类似服务,借助短网址您可以用简短的网址替代 ...
- C语言内存布局简记待补充
C语言存储类型总结内存操作函数总结 用于自己学习和记录 1. void *memset(void *s, int c, size_t n); #include <string.h> 功能: ...
- JavaScript数据可视化编程书籍上面的例子(flotr2)
先看demo再看例子 <!DOCTYPE html> <html lang="en"> <head> <meta charset=&quo ...