本文介绍了一种使用JavaScript实现的倒计时方法，确保即使页面刷新也不会重新开始。通过设置cookie保存倒计时结束时间，首次点击开始后计算剩余时间并用setInterval更新。再次进入页面时，检查cookie中的结束时间，如果未过期则继续倒计时，否则需重新开始。附带代码示例。
最近在做一个项目，用到了点击按钮实现倒计时，这个用js来实现很简单。但是遇到了一个问题
页面刷新后js重新加载导致 倒计时重新开始，或者直接初始化了
后来通过 cookie 保存来实现了js倒计时，关闭页面和强制刷新都不会停止
主要思路
通过获取当前时间 与 倒计时停止时间 之间的时间间隔来确定倒计时的数值。
具体如下：
1.首次加载页面 点击开始
1) 获取当前时间 与要倒计时的时间相加获得要 停止计时的时间
2) 用cookie保存这个停止计时的时候
3) 通过js的setInterval 进行定时刷新时间
4) 当倒计时结束后 清楚cookie中保存的结束时间
2.当第二次进入页面或刷新页面时
1)首先判断cookie中时候有结束时间
2)有取出 和 当前时间求差 如果 差值大于倒计时间隔时间 说明倒计时已结束需要重新点击 否则就将这个差值作为倒计时开始的数字
3）没有需要重新点击开始倒计时
闲话少说，上代码~~~~
<html>
<head>
<title>JS倒计时（无视刷新）</title>
<style>
.disabled {
background: #fff;
color: #ccc;
border: solid 0px;
}
.disabled:hover {
background:none;
color: #ccc;
}
最低0.47元/天 解锁文章
扫一扫
1014
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
