Simple timer with setTimout in Javascript

Question

I'm trying to create a simple timer in javascript that counts down from 5 to 0 on a push of a button. This is my function that I have for the onclick of the button. I'm getting stuck though since it is not counting down. Any hints to where my logic is wrong would be apprciated. Thanks.

function countdown(num) {
    if (num >= 0) {
        document.getElementById("counter").innerHTML=num;
        timer=setTimeout("countdown()", 1000);
        num--;
    }
    else 
        clearTimeout(timer);
}

JaredPar · Accepted Answer · 2011-11-06 02:33:06Z

6

The main problem is your evaluation of countdown as a string was not properly passing num along. Try using a function expression instead.

function countdown(num) {
    if (num >= 0) {
        document.getElementById("counter").innerHTML=num;
        setTimeout(function () { countdown(num - 1) }, 1000);
    }
}

Additionally there is no need for a clearTimeout or a global timer value.

edited Nov 6, 2011 at 2:33

answered Nov 6, 2011 at 2:24

JaredPar

760k152 gold badges1.3k silver badges1.5k bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Doug Owings Over a year ago

nor is there a need for the timer variable, or num--, correct?

Tim Over a year ago

The logical error was not passing in num, however it is acceptable to use strings here, as it just calls eval() on it if you do: setTimeout("countdown("+(num-1)+")", 1000);

Šime Vidas · Accepted Answer · 2011-11-06 02:30:56Z

1

How about this?

button.onclick = function () {
    var n = 5;

    (function loop() {
        label.textContent = n;

        if ( n > 0 ) {
            n -= 1;
            setTimeout( loop, 1000 );
        }
    })();
};

Live demo: http://jsfiddle.net/YhBx6/1/

answered Nov 6, 2011 at 2:30

Šime Vidas

187k66 gold badges290 silver badges392 bronze badges

Collectives™ on Stack Overflow

Simple timer with setTimout in Javascript

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related