웹 페이지를 새로 고칠 때 카운트 다운 타이머가 재설정되지 않도록하려면 어떻게해야합니까?

Question

웹 사이트를 디자인하고 있으며 JavaScript를 사용하여 웹 페이지가로드 될 때 시작되는 5 분 카운트 다운 타이머를 통합했습니다. 그러나 개발자가 아니기 때문에 자바 스크립트 코드를 편집하여 웹 페이지가 다시로드 될 때 타이머가 다시 시작되지 않도록하는 방법을 모르겠습니다. 나는 사용자 쿠키를 저장해야한다는 것을 알고 온라인으로 검색했지만 코드를 삽입 할 때 javascript 코드가 작동하지 않습니다. 여기 누구든지 나를 도울 수 있을까? 고맙습니다! 당신은이 사건에 대한 웹 "세션 저장"API를 사용한다

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); 
}; 

Answer 1

확인이 방법을 재설정하지 않습니다 :

: HTML 코드 :

<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); 
}; 

다음은 동일 코드 모델에서 작동하는 모델입니다. en https://codepen.io/anon/pen/GymRNV?editors=1011

P.S : 샌드 박스이므로 액세스 할 수 없으며 localstorage에 액세스 할 수 없습니다.

Answer 2

:

여기에 5 분 타이머를위한 자바 스크립트 코드입니다. 그것은 당신을 도울 것입니다. 시간이 브라우저의 로컬 스토리지에 따라서 새로 고침에 저장됩니다

https://developer.mozilla.org/en-US/docs/Web/API/Window/sessionStorage