Как создать простой цикл setTimeout

Ответ 1

попробуйте следующее:

var count = 1;

function transition() {

    if(count == 1) {
        $('#ele').html('variation 2');
         count = 2;

    } else if(count == 2) {
        $('#ele').html('variation 3');
         count = 3;

    } else if(count == 3) {
        $('#ele').html('variation 1');
        count = 1;
    }

}
setInterval(transition, 2000);

Ответ 2

Если вам нужен бесконечный цикл, вы должны использовать setInterval(). Это приведет к бесконечному циклу, каждый раз при выполнении следующего варианта:

var i=0;

setInterval(function() {
    switch(i++%3) {
        case 0: alert("variation 1");
        break;
        case 1: alert("variation 2");
        break;
        case 2: alert("variation 3");
        break;
    }

}, 2000);

Если позднее вы решите, что вам нужно остановить повторяющийся код, сохраните возвращаемое значение, когда вы установите интервал и очистите его:

var intervalId = setInterval(function() {
    ...
}, 1000);

clearInterval(intervalId);

Ответ 3

Это лучшее решение:

Метод clearTimeout() очищает таймер, установленный с помощью метода setTimeout().

(function(){
    var timer, count=1;
    function transition(){
        clearTimeout(timer);

        switch(count){
            case 1: count = 2; break;
            case 2: count = 3; break;
            case 3: count = 1; break;
        }

        $('#ele').html('variation ' + count);

        timer = setTimeout(transition, 2000);
    }
    transition();
})();

Ответ 4

У вас есть var перед вашей переменной count внутри функции transition. Удалите их, и внешняя переменная count сохранит свое значение.

Ответ 5

если вы все еще хотите использовать setTimeout и clearTimeout для создания цикла вы должны использовать что-то вроде этой структуры для вашего цикла

var count = 1;
var timer = setTimeout( function(){
    transaction();
} , 2000);

function transition() {

    if(count == 1) {
        $('#ele').html('variation 2');
        count = 2;

    } else if(count == 2) {
        $('#ele').html('variation 3');
        count = 3;

    } else if(count == 3) {
        $('#ele').html('variation 1');
        count = 1;
    }
    //if(condition for continue) 
    setTimeout(transition, 2000);
    //else if you want to stop the loop
    //clearTimeout(timer, 2000);
}

Ответ 6

Мой лучший способ работы в реальной жизни - "Забыть базовые петли" в этом случае, и использовать эту комбинацию "setInterval" включает в себя "setTimeOut" s:

    function iAsk(lvl){
        var i=0;
        var intr =setInterval(function(){ // start the loop 
            i++; // increment it
            if(i>lvl){ // check if the end round reached.
                clearInterval(intr);
                return;
            }
            setTimeout(function(){
                $(".imag").prop("src",pPng); // do first bla bla bla after 50 millisecond
            },50);
            setTimeout(function(){
                 // do another bla bla bla after 100 millisecond.
                seq[i-1]=(Math.ceil(Math.random()*4)).toString();
                $("#hh").after('<br>'+i + ' : rand= '+(Math.ceil(Math.random()*4)).toString()+' > '+seq[i-1]);
                $("#d"+seq[i-1]).prop("src",pGif);
                var d =document.getElementById('aud');
                d.play();                   
            },100);
            setTimeout(function(){
                // keep adding bla bla bla till you done :)
                $("#d"+seq[i-1]).prop("src",pPng);
            },900);
        },1000); // loop waiting time must be >= 900 (biggest timeOut for inside actions)
    }

PS: Поймите, что реальное поведение (setTimeOut): все они начнутся в одно и то же время "три bla bla bla начнут отсчитывать в тот же момент", поэтому сделайте другой тайм-аут, чтобы организовать выполнение.

PS 2: пример цикла синхронизации, но для циклов реакции вы можете использовать события, обещая асинхронное ожидание.