Funktion nicht nach Ablauf einer Zeit sondern eine Zeit lang ausführen

[jemand anders]

Hallo,

im Beispiel soll eine Funktion eine Zeit lan ausgeführt werden, und nach Abschluss soll dann die nächste an die Reihe kommen, bis das Ende erreicht ist. Wer weiß, wie es geht?

Genauere Beschreibung ist in der Fiddle.

Grüße

 

[SpiceLab]

Vielleicht eher mit setInterval (in Verbindung mit clearInterval) anstatt setTimeout.

 

[Chailin]

Ich verstehe nicht genau was du erreichen möchtest. Wenn du nur bis 1.000 zählen möchtest, brauchst du kein Zeitfenster. Wenn du ein Zeitfenster nutzt, wirst du nicht immer auf 1.000 kommen.

Die erste Möglichkeit ist sehr einfach, denn der Programmcode wird nach und nach ausgeführt. Das bedeutet, du verschachtelst einfach 2 Schleifen, wobei die äußere die verfügbaren Elemente (hier 3) durchläuft und die innere bis 1.000 zählt.

Die zweite Möglichkeit ist etwas umständlicher, wenn man dynamisch bleiben möchte. Man könnte im Fall von 3 Elementen einfach 3 Timeouts verschachteln. Wenn man dann aber plötzlich 2, 4 oder 95 Elemente hat, muss man den Code dementsprechend erweitern, was natürlich nicht erwünscht ist.

Da könnte yield helfen.

var divContainer = document.getElementsByTagName("div");
var timePerStep = 500;

function* counter(){
    var value = 0;
    while(true)
    {
        yield value++;
    }
}

function step(elements, index = 0)
{
    if(index >= elements.length)
    {
        return false;
    }

    var iterator = counter();
    var interval = window.setInterval(function(){ iterator.next(); }, 0);
   
    window.setTimeout(function(){
        window.clearInterval(interval);
        var span = elements[index].getElementsByTagName("span")[0];
        span.innerHTML = span.innerHTML + " " + iterator.next().value;
        step(elements, ++index);
    }, timePerStep);
}

step(divContainer);