prevent countdown on page refresh?

Question

Thank you so much to all of you. Today i am trying to create a countdown and again reset this at 15min interval. I am using these code in javascript.

Javascript------

<script type="text/javascript">

$(document).ready(function(){
    setInterval(function(){
        countdown();
    }, 54000);
})

var mins = 15;
var secs = mins * 60;

function countdown() {
  setTimeout('Decrement()',1000);
}
function Decrement() {
   if (document.getElementById) {
       minutes = document.getElementById("minutes");
       seconds = document.getElementById("seconds");

        if (seconds < 59) {
            seconds.innerHTML = secs;
        } else {
           minutes.innerHTML = getminutes();
            seconds.innerHTML = getseconds();
        }
        secs--;
        if(secs > 0)
          {
           setTimeout('Decrement()',1000);
        }
        }
        }
        function getminutes() {
        // minutes is seconds divided by 60, rounded down
        mins = Math.floor(secs / 60);
        return mins;
        }
        function getseconds() {
        // take mins remaining (as seconds) away from total seconds 
        remaining
        return secs-Math.round(mins *60);
        }
 </script>

Call this countdown function on page load

 <body onload="countdown();">

    TIME LEFT: <label id="minutes"></label> : <label id="seconds"></label>
 </body>

As you can see that this countdown start on page load and i tried to restart the countdown on after 15min of time interval....

But i want to run this countdown on a 15min interval and keep continue on page refresh..

Please correct this code send me another reference .

Answer 1

You can use local storage, such as :

localStorage.setItem('countDownValue', curtime); // To set the value
...
curtime = localStorage.getItem('countDownValue'); // To get the value

For More Info Visit - How to make countdown timer not reset when refresh the browser?

Answer 2

You're making your life a little difficult with the way you are handling time.

Here's a suggestion for a simpler approach which also persists the remaining time in localStorage

  const cookieName = 'countDown';
  const savedSeconds = localStorage.getItem(cookieName);

  // If there are seconds saved in localStorage, start with these.
  // Otherwise, start with 900 seconds
  const fifteenMinutes = 900 // 15 minutes in seconds
  const startingSeconds = savedSeconds || fifteenMinutes;
  let remainingSeconds = startingSeconds;

  const minutesLabel = document.querySelector('#minutes');
  const secondsLabel = document.querySelector('#seconds');

  const countdown = () => {
    // If there are any remainingSeconds left, decrement by 1
    // If there are no remainingSeconds left, reset to 15 minutes
    remainingSeconds = remainingSeconds ? remainingSeconds-1 : fifteenMinutes;
    localStorage.setItem(cookieName, remainingSeconds);
    // Update the DOM
    minutesLabel.innerHTML = Math.floor(remainingSeconds/60);
    secondsLabel.innerHTML = remainingSeconds%60;
  }

  // Call countdown every second.
  setInterval(
    countdown,
    1000
  );

prevent countdown on page refresh?

Question

2 answers

solution1
0 2017-10-27 12:36:43

solution2
0 2017-10-27 12:48:02

prevent countdown on page refresh?

Question

2 answers

solution1 0 2017-10-27 12:36:43

solution2 0 2017-10-27 12:48:02

solution1
0 2017-10-27 12:36:43

solution2
0 2017-10-27 12:48:02