刷新页面后使计时器保持活动状态

时间:2020-07-07 08:58:10

标签: javascript local-storage

我想将计时器值(分钟+秒)存储在我的localStorage中,因此,如果我重新加载页面,则计时器仍在运行。 但是实际上计时器已停止,或者我得到了ObjectHTMLSpanElement。

这是我的代码:

class countdown{
    constructor(){
            this.time = document.getElementById("time");
            this.start = 20;
            this.confirmationbutton = document.getElementById("starttimer");
            this.cancelbutton = document.getElementById("annulation");
            
    };


convert(){
    var starmilli = (this.start * 60) * 1000;
    return starmilli;
};

timer(){
    var endDate = new Date().getTime() + this.convert();
    this.timer = setInterval(() => {
            var now = new Date().getTime(); 
            var difference = (endDate - now) / 1000;
            var minutes = Math.floor((difference % 3600) / 60);
            var secondes = Math.floor(difference % 60);
            this.time.textContent = minutes + " : " + secondes;
            console.log(time);
            localStorage.setItem("time", difference);
            if(difference <= 0){
                    clearInterval(this.timer);
                    localStorage.clear();     
            }    
            
    }, 1000);
    document.getElementById("signature").style.display = "none";
};   

stoptimer(){
    clearInterval(this.timer);
    localStorage.clear(); 
    document.getElementById("fin").innerHTML = "Réservation annulé!<br> Actualiser la page pour faire une nouvelle réservation"; 
    document.getElementById("fin").style.color = "red";       
};    

  
};
const resa = new countdown();
document.getElementById("starttimer").onclick = function() { resa.timer(); }
document.getElementById("annulation").onclick = function() { resa.stoptimer(); }

感谢您抽出宝贵的时间来帮助我。

0 个答案:

没有答案