tags:

views:

71

answers:

1

So, I'm making a simple clock that just counts time from a static starting point. The problem is, when the second mark hits 8, it resets to 0. I can't figure out why. Help!

Here's the clock: http://jsfiddle.net/Ender/jMbem/

Here's the code for it:

HTML:

<h1>Mark's Busted Computer Clock</h1>
<div id="time">
    <span id="hour">146</span>:<span id="minute">45</span>:<span id="second">00</span>
</div>

JS:

$(function() {
    setInterval(UpdateSecond, 1000);
});

function UpdateSecond() {
    var num = parseInt($('#second').text());
    num++;
    if (num == 60) {
        num = 0;
        UpdateMinute();
    }
    if (num < 10) {
        num = "0" + num;
    }
    $('#second').text(num);
}

function UpdateMinute() {
    var num = parseInt($('#minute').text());
    num++;
    if (num == 60) {
        num = 0;
        UpdateHour();
    }
    if (num < 10) {
        num = "0" + num;
    }
    $('#minute').text(num);
}

function UpdateHour() {
    $('#hour').text(parseInt($('#hour').text()) + 1);
}
+7  A: 

The problem is that you aren't passing a radix to the parseInt function. Try:

var num = parseInt($('#minute').text(), 10);

More info here: http://www.w3schools.com/jsref/jsref_parseint.asp

Samuel Cole
+1 for pointing out one of those nasty little "gotcha's"...
Justin Ethier
any time something mysterious happens around 8, think parseInt. :)
DGM
Fantastic! Good catch, I had no idea that was necessary. This will be the accepted answer once I'm allowed to accept :)
Ender