Funktion nach 3000 ms abbrechen?

Willibergi · 17 Januar 2016

Moin,
ich habe folgenden Code:

Code:

function show(){
    anfang = new Date();
    angefangen = Date.now();
    while((Date.now()-angefangen)<3000){
        document.getElementById('anzeigeBild').src = "img/bild1.png";
    }
    if((Date.now()-angefangen)>=3000){
        document.getElementById('anzeigeBild').src = "img/bild2.png";
    }
}

Ich möchte damit das bild1.png 3000 ms lang anzeigen, und sobald die 3000 ms vorbei sind, soll das andere Bild angezeigt werden. Ich will damit versuchen, ein Bild anzuzeigen, und wenn der Nutzer binnen 3000ms nicht auf eine Taste drückt, soll ein anderes Bild angezeigt werden.
Mit der while-Schleife, definiere ich, dass, solange der aktuelle ms-Wert (seit 1970) minus dem ms-Wert (seit 1970), bei dem die Funktion begonnen hat, kleiner ist, als 3000ms, das erste Bild angezeigt wird und wenn er größer ist, das zweite. (guckt in die while-Schleife, wenn ich das zu kompliziert erkläre ^^)
In der Konsole erscheint keine Fehlermeldung, trotzdem funktioniert es nicht.
Warum?
LG Willibergi
PS: Alle Variablen sind weiter oben definiert, falls ihr meckern wollt.

NetAktiv · 17 Januar 2016

Wo fragst du denn ab, ob der User eine Taste gedrückt hat und warum setzt in der While Schleife ständig die src, 1x vor der Schleife würde doch reichen. Und wann und wo startest denn die show. Suche mal nach der JavaScript Funktion setTimeout() http://www.w3schools.com/jsref/met_win_settimeout.asp, die nimmt man normal für so Timer-Sachen.

Ergänzung: Ich bekomme hier immer wieder gesagt, dass mein JavaScript von vorgestern ist, aber ich würde es in etwa so machen:
1) Setze eine variable tasteGedrueckt = false;
2) Starte eine BildWechselFunktion mit dem setTimeout=3000ms;
3) Wenn der User eine Taste drückt, dann setze tasteGedrueckt = true;
4) Wenn die BildWechselFunktion nach 3000ms aufwacht, schaut sie nach dem Wert von tasteGedrueckt und wechselt dann das Bild oder auch nicht.

Zusatz: Im ersten Schritt würde ich zum Testen statt einer BildWechselFunktion einfach einen alert(tasteGedrueckt) machen.

Noch ein Mini-Beispiel basierend auf http://www.w3schools.com/jsref/met_win_settimeout.asp

HTML:

<!DOCTYPE html>
<html>
<body>
<p>Click the button to wait 3 seconds, then alert "Hello".</p>
<button onclick="myFunction()">Try it</button>
<button onclick="bClick=true;">stop</button>

<script>
var myVar;
var bClick = false;
function myFunction() {
    myVar = setTimeout(alertFunc, 3000);
}
function alertFunc() {
  alert("Hello click: " + bClick);
}
</script>
</body>
</html>

Willibergi · 18 Januar 2016

Hast Recht.
Dankeschön!

Funktion nach 3000 ms abbrechen?

Willibergi

Mitglied

NetAktiv

Senior HTML'ler

Willibergi

Mitglied

Neueste Beiträge