setTimeout verhält sich unangemessen

hubbl

Erfahrenes Mitglied
Hallo, ich habe folgenden Code gebastelt:
HTML:
<html>
<head><title>Test</title>
<script type="text/javascript">
    var i = 10;
    function zuweisung(){
        i--;
        document.test.btn.value = "Bitte warten (" + i + ")";
    }
    while(i != 0){
        window.setTimeout("zuweisung()", 1000);
    }    
</script>
</head>
<body>
    <form name="test" action="">
        <input type="button" value="Bitte warten (10)" name="btn">
    </form>
</body>
</html>
Um das zu erkären: das Script soll mir einen Button anzeigen auf deim im 1 Sekunden Takt "Bitte Warten (10)", "Bitte Warten (9)", "Bitte Warten (8)" usw. stehen. Wie auch auf manchen Download Portalen.

Kann mir jemand mit der Realisierung helfen und mir erklären warum das da oben diesen Fehler:
help.PNG

erzeugt?
 
while(i != 0){
window.setTimeout("zuweisung()", 1000);
}
der Inhalt einer while-Schleife wird so lang abgearbeitet, wie die Bedingung dafür erfüllt ist....und das ist sie mit Ausnahme von der Sekunde, wo i von 1 auf 0 geht, immer....danach geht i auf -1 und die Bedingung ist wieder erfüllt.

Schreibe stattdessen:
Code:
if(i>0){.....}
 
Klappt genau einmal, bei "Bitte warten (9)" wird wieder angehalten.

Wenn ich

HTML:
while(i > 0){
        setTimeout("zuweisung()", 1000);
    }

schreibe wird aber wieder was unendliches daraus, aber warum?
Ich rufe in setTimeout() die Funktion "Zuweisung()" auf, in der der Zähler i ein runtergezählt wird, also müsste doch bei null Schluss sein, ist es aber nicht.
 
Hallo dein Ansatz mit der while Schleife ist in diesem Fall nicht von Erfolg gekrönt sein (abgesehen von dem Fehler mit dem Zähler) weil deine Schleife innerhalb vom Bruchteil einer Sekunde koplett abgearbeitet wird und nichts anderes macht als 10 Timeouts zu setzen die dann alle samt nach einer sekunde auch im Bruchteil einer Sekunde abgearbeitet werden - dh du wirst nach einer Sekunde mit dem Auge nicht mehr als einen Sprung von 10 auf 0 erkennen.
Es gibt viele Möglichkeiten dein Probelm zu lösen - einer davon wäre z.B. dieser:
HTML:
<html>
<head><title>Test</title>
<script type="text/javascript">
    var i = 10;
    function zuweisung(){
        i--;
        document.test.btn.value = "Bitte warten (" + i + ")";
        if(i > 0){window.setTimeout("zuweisung()", 1000);}
    }
    window.setTimeout("zuweisung()", 1000);
</script>
</head>
<body>
    <form name="test" action="">
        <input type="button" value="Bitte warten (10)" name="btn">
    </form>
</body>
</html>
 

Neue Beiträge

Zurück