使用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. day86:luffy:前端发送请求生成订单&结算页面优惠劵的实现

    目录 1.前端发送请求生成订单 1.前端点击支付按钮生成订单 2.结算成功之后应该清除结算页面的数据 3.后端计算结算页面总原价格和总的真实价格并存到数据库订单表中 2.优惠劵 1.准备工作 2.前端 ...

  2. 【开发板试用报告】鸿蒙OS环境搭建及代码烧录

    鸿蒙系统的代码编译环境需要linux系统,软件开发和代码烧录需要windows环境. Linux环境 参考官方链接:https://gitee.com/openharmony/docs/blob/ma ...

  3. Spider--补充--selenium的使用

    # Selenium (firefox) # 1,介绍: # selenium 是一个 web 的自动化测试工具,是一个包,可以支持 C. java.ruby.python.或都是 C# 语言. # ...

  4. mysql优化之2--索引优化

    1. 创建联合索引时,要注意,离散度大的列前置. 可以通过 select count(distinct(A)),count(distinct(B)) from tb; 看哪个列离散度大. 2. 索引列 ...

  5. [MIT6.006] 19. Daynamic Programming I: Fibonacci, Shortest Path 动态规划I:斐波那契,最短路径

    这节课讲动态规划的内容,动态规划是一种通用且有效的算法设计思路,它的主要成分是"子问题"+"重用".它可以用于斐波那契和最短路径等问题的求解上. 一.斐波那契 ...

  6. 响应式关系数据库处理R2DBC

    目录 简介 R2DBC介绍 项目依赖 创建ConnectionFactory 创建Entity Bean 初始化数据库 获取所有的用户 Prepare Statement 事务处理 WebFlux使用 ...

  7. Python_自动化测试_项目

    <论坛自动化测试项目> 1.自行选择合适的社区 2.功能要求 5个以上,不包含登录页 3.多手动测试   多用selenium IDE 4.生成测试报告,发送邮件 5.计划任务定时完成 6 ...

  8. 建议收藏,从零开始创建一个Activiti工作流,手把手教你完成

    环境配置 项目环境: JDK1.8 tomcat7 maven3.5 开发工具: IDEA activiti7 创建项目 目标:创建一个maven项目,集成Activiti,并自动生成25张数据库表 ...

  9. 12种不宜使用的Javascript语法 ---阮一峰

    原文链接-阮一峰博客 1. == Javascript有两组相等运算符,一组是==和!=,另一组是===和!==.前者只比较值的相等,后者除了值以外,还比较类型是否相同. 请尽量不要使用前一组,永远只 ...

  10. 通过ip访问项目