setInterval issue (js)

Question

I have been trying to fix this script for more than an hour and still can't get it to work. It is a loop performing animate and html jquery events in a setInterval.

Here is the fiddle: http://jsfiddle.net/GNrL3/

Here is the code (same as fiddle but some prefer to have it here):

$(document).ready(function() {

var i = 1;
var startinterval = 0;

$('#clickhere').click(function() {
    startinterval = setInterval("curvalues()", 1000);
});

function curvalues() {
    if ($i == 20) {
        clearInterval(startinterval);
    }
    else {
        $("#square").animate({
            "left": "+=30px"
        }, "slow");
        $("#text").html("Barracks");
        $i++;
    }
}

});

<div id="square" style="position:absolute;height:30px;width:30px;background-color:#F07014;"></div>
<br /><br /><br /><br /><br />
<div id="text" style="height:30px;width:100px;border:1px solid #000">Text box</div>
<br /><br />
<input type="button" value="Start" id="clickhere"/>

My belief is that the issue concerns the setInterval of the function, but still, the syntax seems good to me...

Edgar Villegas Alvarado · Accepted Answer · 2011-07-07 04:01:57Z

3

You have a function-scope problem. Instead of this:

setInterval("curvalues()", 1000);

do this:

setInterval(curvalues, 1000);

EDIT You have one more mistake. Your counter variable has a wrong name. It should be declared like this:

var $i = 1; //You missed the '$'

(or reference all your vars with i instead of $i)

I updated your fiddle: http://jsfiddle.net/GNrL3/1/ and it works now.

Hope this helps. Cheers

answered Jul 7, 2011 at 4:01

Edgar Villegas Alvarado

18.4k2 gold badges45 silver badges61 bronze badges

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

2 Comments

Adam Strudwick Over a year ago

Thanks! I keep learning everyday! While you're there, do you have any idea if there is a way to pause/resume the function or this is impossible to do?

Adam Strudwick Over a year ago

@Edgar I know, but I just want to pause it and start it back again where it was paused (not from the beginning)

Kon · Accepted Answer · 2011-07-07 04:03:15Z

2

Change this line:

startinterval = setInterval("curvalues()", 1000);

To this:

startinterval = setInterval(curvalues, 1000);

Or this:

startinterval = setInterval(function() { curvalues(); callSomethingElse(); }, 1000);

And get rid of the $ in front of i. There's no need for that.

answered Jul 7, 2011 at 4:03

Kon

27.5k12 gold badges64 silver badges87 bronze badges

4 Comments

Adam Strudwick Over a year ago

Btw, do you have any idea if there is a way to pause/resume the function or this is impossible to do?

Kon Over a year ago

To stop what setInterval started call clearInterval(startinterval);. Though I think "startinterval" is a bad name for a variable in this case and I'd change it to something like "timer" or just "interval".

Adam Strudwick Over a year ago

I know, but I just want to pause it and start it back again where it was paused (not from the beginning)

Kon Over a year ago

Then make sure your logic within the function being invoked by setInterval doesn't reset variables upon execution.

Collectives™ on Stack Overflow

setInterval issue (js)

2 Answers 2

2 Comments

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related