如何在Web中只运行一个计时器

时间:2018-03-26 06:19:51

标签: javascript html angular timer setinterval

我希望每秒增加1秒的时间。我需要将localStorage用于其他目的...... 所以,我添加setInterval并将每秒递增到localStorage

但问题是,如果我在两个标签页中打开同一页面,则秒数会增加2倍。

我想一次只运行一个增量。我怎么能这样做......

这是我到目前为止所尝试的内容

这是我必须增加时间的代码

this.timer = setInterval(() => {
localStorage.setItem('currentTime',String(currentTime));
});

**注意:**

我理解我可以拥有一个局部变量并在UI中显示,但我想将其存储在localStorage中用于其他目的。

要替换setInterval,我还准备更改Observable.interval,例如

import {Observable} from 'rxjs/Rx';
  Observable.interval(1000).subscribe(x => {
    localStorage.setItem('currentTime',String(currentTime));
  });

但它无法检查现有的增量器是否正在运行。我怎么能这样做

1 个答案:

答案 0 :(得分:1)

如果上次保存的时间与新的保存时间之间的差异不等于您的间隔时间,您可以设法不将时间保存到本地存储中:

this.timer = setInterval(() => {
    var currentTime = new Date();
    var lastTime = localStorage.getItem('currentTime');
    if (lastTime) {
        var lastTimeTimestamp = new Date(lastTime).getTime();
        var currentTimeTimestamp = currentTime.getTime();
        if (currentTimeTimestamp - lastTimeTimestamp >= 1000) {
            localStorage.setItem('currentTime',String(currentTime));
        }
    } else {
        localStorage.setItem('currentTime',String(currentTime));
    }

}, 1000);