javascript setInterval timer issue

Question

the code :

function startTimer() {
  var i = 0;
  var TimeInterval = setInterval(function () {
    $("#Time").html(i++);
  }, 1000);
  setTimeout(function () {
    clearInterval(TimeInterval);
  }, 2000);
}

my problem is that $("#Time").html(i++) is always 0 and not incrementing

I think the problem is that you're stopping the interval before it has chance to run a 2nd time (1st time will show 0, but increment i for next time) — Reinstate Monica Cellio
– Reinstate Monica Cellio, Commented Jul 24, 2013 at 9:45
What are you actually trying to do, because all of the above can be done by getting rid of both timers and just putting $("#Time").html("1") - obviously I know that's not what you want. — Reinstate Monica Cellio
– Reinstate Monica Cellio, Commented Jul 24, 2013 at 9:46
then you should place 120000 instead of 2000 in clearInterval :) because 2000 is 2 seconds, not 2 minutes :) — Gintas K
– Gintas K, Commented Jul 24, 2013 at 9:53

Ramki · Accepted Answer · 2013-07-24 10:25:24Z

1

<!DOCTYPE html>
<html>
<head>
<script type = 'text/javascript' src='//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js'></script>
<script>
(function startTimer() {//selef executing function
 var i = 0;
 var TimeInterval = setInterval(function () {
    $("#button").html(i++);
   }, 1000);
   })()//end of function
</script>
</head>
<body>
 <p id='button'></p>
 </body> 
</html>

set time out should be removed from your code then it will work.see the above code.it works

answered Jul 24, 2013 at 10:25

Ramki

1661 silver badge13 bronze badges

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

Comments

Thor Jacobsen · Accepted Answer · 2013-07-24 09:56:10Z

0

function startTimer() {
  var i = 0;
  var TimeInterval = setInterval(function () {
    $("#Time").html(++i);
  }, 1000); // This will run every 1000ms == 1s
  setTimeout(function () {
    clearInterval(TimeInterval);
  }, 2000); // This is 2000 ms == 2s. 120000ms is 2min
}

I've only changed i++ to ++i - but the difference is probably what you want.

With i++, i is evaluated first, then incremented - with ++i, i is first incremented, then evaluated.

answered Jul 24, 2013 at 9:56

Thor Jacobsen

8,8992 gold badges29 silver badges26 bronze badges

Comments

Gintas K · Accepted Answer · 2013-07-24 09:57:26Z

0

function startTimer() {
  var i = 0;
  var TimeInterval = setInterval(function () {
    $("#Time").html(i++);
  }, 1000);
  setTimeout(function () {
    clearInterval(TimeInterval);
  }, 120000);
}

this code increments the html each second, until 2 minutes are passed :)

answered Jul 24, 2013 at 9:57

Gintas K

1,4783 gold badges18 silver badges39 bronze badges

Comments

RobH · Accepted Answer · 2013-07-24 10:11:04Z

0

I think this is easiest with just one timeout that reschedules itself:

function countForTwoMins() {
    var count = 1,
        timer = function () {
            $("#Time").html(count++);
        };
    window.setTimeout(function() {
        timer();
        if (count < 120) {
            window.setTimeout(arguments.callee, 1000);
        }
    }, 1000);
}

countForTwoMins();

http://jsfiddle.net/ybyu5/

Of course, if you care about arguments.callee being deprecated:

function countForTwoMins() {
    var count = 1,

    function callback () {
        $("#Time").html(count++);
        if (count < 120) {
            window.setTimeout(callback, 1000);
        }
    }        
    window.setTimeout(callback, 1000);
}

edited Jul 24, 2013 at 10:11

answered Jul 24, 2013 at 10:06

RobH

3,6101 gold badge25 silver badges48 bronze badges

Collectives™ on Stack Overflow

javascript setInterval timer issue

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related