JavaScript案例：短信验证码倒计时
展示效果：
代码示例：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>短信验证码倒计时</title>
</head>
<body>
<input type="text">
<button>发送</button>
<script>
var btn = document.getElementsByTagName("button")[0];
// 剩余的秒数
var time = 20;
btn.onclick = function () {
// 按钮变灰色，并且无法点击
btn.disabled = true;
// 倒计时
var timer = setInterval(function () {
if (time==0){
// 清除定时器
clearInterval(timer);
btn.disabled = false;
btn.innerText = "发送";
time = 20;
}else {
btn.innerText = "还剩下" + time + "秒";
time--;
}
},1000)
}
</script>
</body>
</html>
JavaScript案例：短信验证码倒计时的更多相关文章
- jQuery获取短信验证码+倒计时实现
jQuery 短信验证码倒计时 <script type="text/javascript" charset="utf-8"> $(function ...
- android 获取短信验证码倒计时
android 获取短信验证码倒计时 watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvbWVuZ2xlbGUxMzE0/font/5a6L5L2T/fonts ...
- js 发送短信验证码倒计时
html <input type="button" id="btn" value="免费获取验证码" onclick="se ...
- 基于jquery的-获取短信验证码-倒计时
在制作短信验证的时候,需要做一个获取短信按钮,点击后显示倒计时, html代码如下: <input class="gain" type="button" ...
- iOS 短信验证码倒计时按钮的实现
验证码倒计时按钮的应用是非常普遍的,本文介绍了IOS实现验证码倒计时功能,点击获取验证码,进入时间倒计时,感兴趣的小伙伴们可以参考一下: 实现思路: 创建按钮,添加点击方法: 用NSTimer定时器, ...
- 在ionic中使用短信验证码倒计时
页面上 <button class="code" (click)="getCode()" [disabled]="!verifyCode.dis ...
- js,JQ获取短信验证码倒计时
按钮 <a href="javasript:void(0);"onclick="settime(this);">获取手机验证码</a> ...
- js实现获取短信验证码倒计时
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...
- 发送短信验证码倒计时，CountDownTimer；
1.声明CountDownTimer的成员变量: private CountDownTimer countDownTimer; 2.设置倒计时总时间和间隔时间: countDownTimer = ne ...
- iOS-发送短信验证码倒计时
/** 发送手机验证码 */ -(void)startSenderYzmMessage{ __block ; //倒计时时间 dispatch_queue_t queue = dispatch_get ...
随机推荐
- SQLSERVER 快照隔离级别 到底怎么理解?
一:背景 1. 讲故事 上一篇写完 SQLSERVER 的四个事务隔离级别到底怎么理解? 之后,有朋友留言问什么时候可以把 snapshot 隔离级别给补上,这篇就来安排,快照隔离级别看起来很魔法,不 ...
- 基于View接口
目录 基于View接口 1.写模型表以及数据库迁移 3.使用CBV写查询所有的视图接口 4.配路由 基于View接口 Django原生即继承View来实现写接口,的确过程很繁杂,很多东西都是手动写 ...
- @ControllerAdvice解密请求，加密响应
package com.xf.config; import java.io.IOException; import java.io.InputStream; import java.lang.refl ...
- evil 控制窗口大小，比快捷键方便
下面是vim原本的支持的键 可以用于 emacs evil ,evil 用这个比用快捷键还方面些 1.纵向调整 :res[ize] num 指定当前窗口为num列num行 :res[ize] +num ...
- JAVA虚拟机16-方法的动态调用
更详细:https://www.cnblogs.com/jthr/p/15762527.html 1.子类重写父类方法 1.1父类 public class Father { public int n ...
- ROS入门：话题
1.listener.cpp #include "ros/ros.h" #include "std_msgs/String.h" //回调函数,接收到话题后进入 ...
- GIN--HOW POWERFUL GNN
HOW POWERFUL ARE GRAPH NEURAL NETWORKS? 本文是 Jure Leskovec 又一力作,首先对图神经网络的原理做了深入检出.提纲挈领的叙述,然后从原理方面介绍了如 ...
- 【KAWAKO】iphone13pro开箱流程
目录 全程录像 检查包装盒 检查包装盒内物品 检查各种码 拆封 激活 激活之后 检查屏幕 检查其它功能 贴膜(选) References 全程录像 如果你觉得你所购买的平台 (比如某ABB格式名字的平 ...
- Git常用指令集合🔥
关联文章:Git入门图文教程(1.5W字40图)--深入浅出.图文并茂 指令-查看状态信息 指令 描述 git --version 查看git版本 git status 查看本地仓库状态,比较常用的指 ...
- JZOJ 2020.07.27【NOIP提高组】模拟
总结 今天的题还好,不幸拿了 \(rank1\),只有 \(380pts\) 实际 \(AK\) 也不难 前三题都是思维题 后面一题其实不过是简单的数据结构优化 \(dp\) 的题 用 \(GSM\) ...