h5倒计时,页面在后台时,保证倒计时继续

原创
2020/10/22 14:37
阅读数 2.3K

用js写了一个倒计时(setInterval ,--的方法),测试时发现,部分浏览器(QQ浏览器、一些自带浏览器)在将页面切换到后台时,倒计时会停止,页面重新展示出来时,倒计时继续。这不符合需求,需求是要求页面在后台倒计时也要继续。

换了个思路:开始倒计时时,获取当前时间戳存入本地,然后用setInterval每个一秒获取当前的时间戳,再获取两个时间戳的差值。

具体实现代码如下:

changeShow(){
    this.downStart = (Date.parse(new Date()))/1000;//要存入sessionstorage
    this.timeDown()     
},
timeDown(){
    var _this = this;
    _this.time = setInterval(function () {
      _this.downEnd = (Date.parse(new Date()))/1000;
      _this.seconds =  _this.downEnd - _this.downStart//相差的描述
      var v = _this.allSeconds - _this.seconds
      _this.seconds = v%60
      _this.minutes = Math.floor(v/60)
    },1000);
},

 

展开阅读全文
加载中
点击引领话题📣 发布并加入讨论🔥
打赏
0 评论
0 收藏
0
分享
返回顶部
顶部