vue实现验证码倒计时60秒的具体代码
vue实现验证码倒计时60秒的具体代码
<span v-show="show" @click="getCode">获取验证码</span>
<span v-show="!show" class="count">{{count}} s</span> data(){
return {
show: true,
count: '',
timer: null,
}
},
methods:{
getCode(){
const TIME_COUNT = 60;
if (!this.timer) {
this.count = TIME_COUNT;
this.show = false;
this.timer = setInterval(() => {
if (this.count > 0 && this.count <= TIME_COUNT) {
this.count--;
} else {
this.show = true;
clearInterval(this.timer);
this.timer = null;
}
}, 1000)
}
}
}
vue实现验证码倒计时60秒的具体代码的更多相关文章
- js 验证码 倒计时60秒
js 验证码 倒计时60秒 <input type="button" id="btn" value="免费获取验证码" /> & ...
- js实现倒计时60秒的简单代码
<!DOCTYPE html> <html lang="en"> <head> <meta http-equiv="Conten ...
- jQuery实现发送验证码倒计时60秒
前端HMTL: <div class="form_box"> <div class="line mb40"> <div class ...
- javaScript 验证码 倒计时60秒
<input type="button" id="btn" value="免费获取验证码" /> <script type ...
- js 简单实现获取短信按钮倒计时60秒
<!DOCTYPE html><html lang="en"><head> <meta http-equiv="Content- ...
- iOS-验证码倒计时60秒
一. 要求 1.点击获取验证码按钮,60秒倒计时,按钮变成不可点击状态,按钮文字变成倒计时的秒数. 2.当倒计时为0的时候,释放掉定时器NSTimer,按钮变成可以点击状态,按钮文字变成"获 ...
- Android 实现简单 倒计时60秒,一次1秒
倒计时功能如上图所示,其实就几行代码即可实现效果啦!!! /** 倒计时60秒,一次1秒 */ CountDownTimer timer = new CountDownTimer(60*1000, 1 ...
- Jquery插件实现点击获取验证码后60秒内禁止重新获取
通过jquery.cookie.js插件可以快速实现“点击获取验证码后60秒内禁止重新获取(防刷新)”的功能 先到官网(http://plugins.jquery.com/cookie/ )下载coo ...
- jQuery实现发送短信验证码后60秒倒计时
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script sr ...
随机推荐
- jq三级联动
test.html <div class="a_list"> <div class="a_title">商城分类:</div> ...
- 前台js根据当前时间生成订单号
*********前台显示框**************** <input type="text" id="WIDout_trade_no" name=& ...
- VIm快捷操作
vim快捷操作 移动 行级移动 $ 行尾 0 行头 段级移动 { 段首 } 段尾 屏幕级别 L: 屏幕尾部 H: 屏幕头部 文档级别 G: 文档尾部 1G:头部 nG:文档n行 删除 dd: 删除当前 ...
- 壁虎书8 Dimensionality Reduction
many Machine Learning problems involve thousands or even millions of features for each training inst ...
- python连接服务器上传文件,后台执行命令
上传文件 import os import paramikoimport logging from django.core.cache import cache from YunTai import ...
- 关于反射和JVM的整理
- ASO的效果应该如何去评判,有什么标准可以量化指标
ASO的效果应该如何去评判,有什么标准可以量化指标 以往我们主要会教大家怎么做 ASO 优化,优化中有什么技巧……在掌握ASO优化技巧之后,从执行层面来考虑,就该选择流量平台了. 目前市场上的流量平台 ...
- 【C++】满二叉树问题
/* 给出一棵满二叉树的先序遍历,有两种节点:字母节点(A-Z,无重复)和空节点(#).要求这个树的中序遍历.输出中序遍历时不需要输出#. 满二叉树的层数n满足1<=n<=5. Sampl ...
- jQuery实现图片懒加载
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- TPS6116x 1-wire总线的分析与驱动实现
1-wire总线的特点 1-wire协议是用一条数据线作为总线进行数据通信的协议. 1-wire总线有以下特点: 1. 可以组建网络,个数没有限制. 2. 使用GPIO的特性就可以,不需要专门的控制器 ...