Javascript (Jquery) Loop not working

Question

this is my first post on the forum. Here i have a javascript attempting to loop, and to set each element as an active class, then wait, remove the class and add it to the next element. My problem is that it does the first one, then no more...

var i = 1;

function myLoop() {
    setTimeout(function() {
        var i = 1;
        var j = (i - 1);

        $("#nH" + j).removeClass("active");
        $("#nH" + i).addClass("active");

        i++;
        if (i < 5) {
            myLoop();
        }
    }, 3000)
}

myLoop();

It looks like it will call myLoop indefinitely... and it's not really a loop, it's recursion. The whole approach is a bit confusing. — Felix Kling
– Felix Kling, Commented Feb 29, 2012 at 15:55
Your code executes fine in Chrome. What browser are you using? Are you getting any error? Maybe it's detecting the infinite recursion. — Greg B
– Greg B, Commented Feb 29, 2012 at 15:58
What does the javascript console say? anything? which browser? — Sid
– Sid, Commented Feb 29, 2012 at 16:00
What do you want it to do after 5 iterations - stop or start all over again? — James Gaunt
– James Gaunt, Commented Feb 29, 2012 at 16:00
This aproach is really confusing and got some errors. Like i++ before if(i < 5). And it is infinite... i will never be 5. It will call myLoop() over and over again. Browsers will stop this script from running,seeing the infinte loop. Edith: you just set var i = 1 on two spots. One spot is global, the other spot is a private variable of myLoop(). Delete var i = 1 in myLoop() and set i++ after your if statement. — Tai Kahar
– Tai Kahar, Commented Feb 29, 2012 at 16:06

mgraph · Accepted Answer · 2012-02-29 15:57:48Z

3

remove var i = 1; before var j = (i - 1); and add it here

  if (i < 5) {
     i=1;
     myLoop(); 

  }

answered Feb 29, 2012 at 15:57

mgraph

15.3k4 gold badges43 silver badges76 bronze badges

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

Comments

Sid · Accepted Answer · 2012-02-29 16:02:46Z

1

I believe it is because you are assigning i equal to 1 and therefor it is removing the class of the same element again and again. So it is actually being called multiple times but you don't realize as the effect is the same. Problem is with your logic with the variable i and j. Try this.

var i = 1;

function myLoop() {
    setTimeout(function() {

        var j = (i - 1);

        $("#nH" + j).removeClass("active");
        $("#nH" + i).addClass("active");

        i++;
        if (i==5)
           i=1;
        if (i < 5) {
            myLoop();
        }
    }, 3000)
}

myLoop();

answered Feb 29, 2012 at 16:02

Sid

7,6412 gold badges31 silver badges42 bronze badges

Comments

xdazz · Accepted Answer · 2012-02-29 16:40:30Z

0

Here is a solution without using loop and global variable. The example.

setInterval((function(min, max){
    var i = min;
    return function() {
        $("#nH"+i).addClass("active");
        $("#nH"+(i===min ? max : i-1)).removeClass("active");
        if (++i > max ) i = min;
    }
})(0, 4), 1000);

answered Feb 29, 2012 at 16:40

xdazz

161k38 gold badges255 silver badges278 bronze badges

Comments

mpm · Accepted Answer · 2012-02-29 15:57:24Z

-1

because you need to call setTimeout again in your loop

var i = 1;                    

function myLoop () {       

    var j = (i-1);

$("#nH" + j).removeClass("active");
$("#nH" + i).addClass("active");

    i++;
  if (i < 5) {        
     return setTimeout(myLoop,3000); /// <- HERE       
  }                   
}

setTimeout(myLoop,3000);

answered Feb 29, 2012 at 15:57

mpm

20.2k7 gold badges52 silver badges56 bronze badges

1 Comment

Jivings Over a year ago

This is not right. This way he'll get two timeouts before the subsequent events happen.

Collectives™ on Stack Overflow

Javascript (Jquery) Loop not working

4 Answers 4

Comments

Comments

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related