CODEWITHSUNDEEP
javascripttimercountdown
user76449
user76449

Reputation: 55

Timer wont stop at 00:00

My countdown timer wont stop 00:00 it just keeps going until it reaches " -01:59 " then " -02:59 " and so on , I changed some of the code here and there but it still keeps going and going 

<html>

<head>
    <title>Countdown</title>
    <script type="text/javascript">
    // set minutes
    var mins = 1;

    // calculate the seconds (don't change this! unless time progresses at a      different speed for you...)
    var secs = mins * 60;

    function countdown() {
        setTimeout('Decrement()', 1000);
    }

    function Decrement() {
        if (document.getElementById) {
            minutes = document.getElementById("minutes");
            seconds = document.getElementById("seconds");
            // if less than a minute remaining
            if (seconds < 59) {
                seconds.value = secs;
            } else {
                minutes.value = getminutes();
                seconds.value = getseconds();
            }
            secs--;
            setTimeout('Decrement()', 1000);
        }
    }

    function getminutes() {
        // minutes is seconds divided by 60, rounded down
        mins = Math.floor(secs / 60);
        return ("0" + mins).substr(-2);
    }

    function getseconds() {
        // take mins remaining (as seconds) away from total seconds remaining
        return ("0" + (secs - Math.round(mins * 60))).substr(-2);
    }
    </script>
</head>

<body>
    <div id="timer">
        This is only valid for the next
        <input id="minutes" type="text" style="width: 60px; border: none; background-color:none; font-size: 50px; font-weight: bold;"> :
        <input id="seconds" type="text" style="width: 60px; border: none; background-color:none; font-size: 50px; font-weight: bold;">
    </div>
    <script>
    countdown();
    </script>

Upvotes: 0

Views: 207

Answers (1)

hungndv
hungndv

Reputation: 2141

Here you are: should assign setTimeout to a variable, when secs is 0, clear the time out.

     // set minutes
    var mins = 1;

     // calculate the seconds (don't change this! unless time progresses at a      different speed for you...)
    var secs = mins * 10;
    var timeout;

    function countdown() {
      timeout = setTimeout('Decrement()', 1000);
    }

    function Decrement() {
      if (document.getElementById) {
        minutes = document.getElementById("minutes");
        seconds = document.getElementById("seconds");
        // if less than a minute remaining
        if (seconds < 59) {
          seconds.value = secs;
        } else {
          minutes.value = getminutes();
          seconds.value = getseconds();
        }
        secs--;
        if (secs < 0) {
          clearTimeout(timeout);
          return;
        }
        countdown();
      }
    }

    function getminutes() {
      // minutes is seconds divided by 60, rounded down
      mins = Math.floor(secs / 60);
      return ("0" + mins).substr(-2);
    }

    function getseconds() {
      // take mins remaining (as seconds) away from total seconds remaining
      return ("0" + (secs - Math.round(mins * 60))).substr(-2);
    }
    countdown();
<div id="timer">This is only valid for the next
  <input id="minutes" type="text" style="width: 60px; border: none; background-color:none; font-size: 50px; font-weight: bold;">:
  <input id="seconds" type="text" style="width: 60px; border: none; background-color:none; font-size: 50px; font-weight: bold;">
</div>

Hope this helps.

Upvotes: 2

Related Questions