ウェブページの更新時にカウントダウンタイマーがリセットされないようにするにはどうすればよいですか？

私はウェブサイトを設計しており、JavaScriptを使用してウェブページが読み込まれたときに開始する5分のカウントダウンタイマーを統合しました。しかし、私は開発者よりもデザイナーの方が多いので、JavaScriptコードを編集してウェブページが再ロードされたときにタイマーが再起動しないようにする方法はわかりません。私はユーザーのクッキーを保存しなければならないことを知っている、私はオンラインで検索したが、JavaScriptコードは、コードを挿入したときに動作しませんでした。誰も私を助けることができるだろうか？ありがとうございました！ここでウェブページの更新時にカウントダウンタイマーがリセットされないようにするにはどうすればよいですか？

は5分タイマーのためのJavaScriptコードです：

function startTimer(duration, display) { 
var timer = duration, minutes, seconds; 
setInterval(function() { 
    minutes = parseInt(timer/60, 10) 
    seconds = parseInt(timer % 60, 10); 

    minutes = minutes < 10 ? "0" + minutes : minutes; 
    seconds = seconds < 10 ? "0" + seconds : seconds; 

    display.textContent = minutes + " " + " " + seconds; 

    if (--timer < 0) { 
     timer = duration; 
    } 
}, 1000); 
} 

window.onload = function() { 
var fiveMinutes = 60 * 5, 
    display = document.querySelector('#time'); 
startTimer(fiveMinutes, display); 
};

出典

2017-12-29 Ismail Saraoui

時間は、ブラウザのローカルストレージに保存されているので、リフレッシュにリセットされません確認し、このアプローチ：

：HTMLのCODE：

<div id="time"> 

</div>

：JSコード：

function startTimer(duration, display) { 
var timer = duration, minutes, seconds; 
setInterval(function() { 
    minutes = parseInt(timer/60, 10) 
    seconds = parseInt(timer % 60, 10); 

    minutes = minutes < 10 ? "0" + minutes : minutes; 
    seconds = seconds < 10 ? "0" + seconds : seconds; 

    display.textContent = minutes + " " + " " + seconds; 

    if (--timer < 0) { 
     timer = duration; 
    } 
    console.log(parseInt(seconds)) 
    window.localStorage.setItem("seconds",seconds) 
    window.localStorage.setItem("minutes",minutes) 
}, 1000); 
} 

window.onload = function() { 
    sec = parseInt(window.localStorage.getItem("seconds")) 
    min = parseInt(window.localStorage.getItem("minutes")) 

    if(parseInt(min*sec)){ 
    var fiveMinutes = (parseInt(min*60)+sec); 
    }else{ 
    var fiveMinutes = 60 * 5; 
    } 
    // var fiveMinutes = 60 * 5; 
    display = document.querySelector('#time'); 
    startTimer(fiveMinutes, display); 
};

ここでは、コーデップja https://codepen.io/anon/pen/GymRNV?editors=1011

P.S：サンドボックスであり、ローカルストレージにアクセスできないため、ここでは使用できませんでした。

出典

2017-12-29 12:34:32

ありがとうございました！それは完璧に働いた。 –