使用cookie倒计时60s

Vue实例创建一个变量time=0

生命周期一般是created,给time赋值一个cookie的键值-当前的时间(因为刚进入页面这时是没有cookie的,所以time变成一个负值),所以判断time值是否>0,是否调用定时器函数

this.time = getCookie().email - parseInt(new Date().getTime() / 1000)

定义一个函数定时器,数据绑定,使用{{}}插值表达式在标签,定时器每次time自身减一,判断time值<=0时,终止定时器的使用

const count = setInterval(() => {

this.time--

if (this.time <= 0) clearInterval(count)

}, 1000)

点击事件函数:创建一个cookie,键值为当前的时间戳+60,time赋值60,调用定时器函数

const end = parseInt(new Date().getTime() / 1000) + 60

设定两个button,判断条件显示一个按钮

cookie倒计时的更多相关文章

  1. 设置cookie倒计时让让表单自动提交

    <%@ page language="java" import="java.util.*" pageEncoding="gbk"%&g ...

  2. js cookie 页面倒计时

    疯了啦 写了一篇没有保存需求:页面倒计时 只从第一次加购开始公共方法cookie的设置 获取function getCookie(c_name){ if (document.cookie.length ...

  3. 网页存储倒计时与解决网页cookie保存多个相同key问题

    短信倒计时多用网页临时存储,这可以保证网页在关闭状态也可记时. <p class="test_button" id="getcode">获取验证码& ...

  4. Webform:Session、Cookie对象的用法

    Session 优点:1.使用简单,不仅能传递简单数据类型,还能传递对象.  2.数据量大小是不限制的. 缺点:1.在Session变量存储大量的数据会消耗较多的服务器资源. 2.容易丢失. 使用方法 ...

  5. webform中Session和Cookie对象的用法

    Session: Session:在计算机中,尤其是在网络应用中,称为"会话控制".Session 对象存储特定用户会话所需的属性及配置信息.这样,当用户在应用程序的 Web页之间 ...

  6. js实现发送短信验证码后的倒计时功能(无视页面刷新)

    [1].[代码] 这是页面上的发送验证码按钮 跳至 [1] [2] [3]<input id="second" type="button" value=& ...

  7. Session与Cookie

    Session与Cookie的比较 Cookie与Session都可以进行会话跟踪,但是实现的原理不太一样.一般情况下二者均可以满足需求,但有时候不可以使用Cookie,有时候不可以使用Session ...

  8. js防刷新的倒计时

    近期在维护考试系统,在进行考试測试时无意中点击了刷新button.可是上面的倒计时并没有受到影响.同一时候在几篇博客中也有这种样例,所以我想看看它究竟是如何防止刷新的. 假设是用cs代码写.我们可能会 ...

  9. session和cookie介绍以及session简单应用

    介绍http协议与TCP协议:        http协议:是短连接,关闭浏览器的时候断开与服务器的连接         TCP协议:是长连接,连接一直存在         http协议是在TCP协议 ...

随机推荐

  1. C++变量的存储类型

    C++变量和函数包括两个属性:数据类型和数据的存储类型.存储类型是指数据在内存中存储的方式.变量的存储类型分为四种:自动类型(auto),寄存器类型(register).静态类型(static)外部类 ...

  2. 淘宝客?CPS技术是怎么实现的?

    前言 微信搜[Java3y]关注这个有梦想的男人,点赞关注是对我最大的支持! 文本已收录至我的GitHub:https://github.com/ZhongFuCheng3y/3y,有300多篇原创文 ...

  3. nice-ni 耗光cpu

    可以看到 低优先级的进程 暂用了比较高的CPU时间. top 命令中可以看到 NI 为19, 其优先级最低 但是使用cpu 最高. 说明这个进程需要经行优化了, 通过gdb 发现此进程一直都在处理报文 ...

  4. MySQL架构(面)

    和其它数据库相比,MySQL有点与众不同,它的架构可以在多种不同场景中应用并发挥良好作用.主要体现在存储引擎的架构上,插件式的存储引擎架构将查询处理和其它的系统任务以及数据的存储提取相分离.这种架构可 ...

  5. 1. 线性DP 300. 最长上升子序列 (LIS)

    最经典单串: 300. 最长上升子序列 (LIS) https://leetcode-cn.com/problems/longest-increasing-subsequence/submission ...

  6. Serilog 源码解析——数据的保存(中)

    上一篇文章中揭露了日志数据的绑定逻辑,主要说明了日志数据绑定的结果信息,即EventProperty结构体和LogEventProperty类,以及日志数据与具名属性Token的绑定类Property ...

  7. CTF-WEB-XTCTF-Web_php_unserialize

    题目来源 XTCTF-Web_php_unserialize 题目考点:PHP代码审计.PHP正则.PHP序列化与反序列化 解题思路 题目源码 <?php class Demo { privat ...

  8. Python3 Socket

    Socket socket介绍 socket意为套接字,是应用层与传输层TCP/IP,UDP之间通信的中间软件抽象层,它是一组接口.使用时只需遵循socket的格式与规定去编程,让socket组织数据 ...

  9. zabbix的搭建及操作(3)监控 MySQL 及 HTTP 状态监控

    书接上回 -- 详情点击 Server端以配置好 mariadb(MySQL) 及 http 服务 Zabbix实现监控 mysql 数据库 server服务器端配置 vim /usr/local/z ...

  10. 思维导图软件iMindMap制作技巧有哪些

    iMindMap11是iMindMap全新的版本.它可以提供给我们更好的灵活性以便我们将我们的思维进行可视化,并进一步的呈现和开发出属于自己的想法以及思维方式.在iMindMap中我们可以利用思维导图 ...