Timer in JavaScript zu realisieren ist eigentlich recht leicht, dazu braucht mal nur die Funktionen window.setTimeout bzw. window.setInterval mit entsprechenden Argumenten zu füttern.
// funktion verzögert aufrufen function machWas() { alert('alert() mit 1000ms verzögerung!'); } window.setTimeout(machWas, 1000); // funktion alle X Millisekunden aufruden function machWasOft() { alert('alle 1000ms ein alert()'); } window.setInterval(machWasOft, 1000);
Doch was ist, wenn ich jetzt einen solchen Timer ändern oder abbrechen möchte? Das ist eigentlich auch nicht schwer – die Funktionen setTimeout/setInterval geben ein Objekt zurück über das sie sich wieder beenden lassen.
var x = 0; function machWasAbbrechbarOft() { x += 1; if (x > 200) { window.clearInterval(running); // beende das "Interval" nach 201 Ausführungen } } var running = window.setInterval(machWasAbbrechbarOft, 1000);
Das funktioniert in kleinen JavaScript Codes sicher ohne Probleme, wenn man allerdings an einem großem JavaScript Projekt arbeitet, macht es die Arbeit nicht gerade leichter wenn man immer dieses Rückgabe-Objekt (im Beispiel running) irgendwo speichern muss, vorallem wenn man von überall im Code darauf zugreifen will.
Um dieses Problem zu lösen habe ich ein jQuery Timer Plugin gefunden. (Siehe http://plugins.jquery.com/project/timers) Wer an einem größerem JavaScript Projekt arbeitet, sollte meiner Meinung nach aufjedenfall auf ein Framework setzen – jQuery ist hier meine Wahl von daher bietet sich dieses Plugin an.
Mit diesem Plugin geht das „Interval“ setzen dann wie folgt:
$(document).everyTime(1000, "machWasOftAbbrechbar", function(i) { // alle 1000ms alert('Hallo ich bin der ' + i + 'te Aufruf!'); // machWasOftAbbrechbar, hier die funktion die aufgerufen werden soll }, 200); // 200 mal ausführen
Der zweite Parameter, machWasOftAbbrechbar, stellt hierbei ein sogenanntes „label“ dar, über das man den gestarten Timer dann wieder abbrechen kann:
$(document).stopTime("machWasOftAbbrechbar"); // stoppe machWasOftAbbrechbar
Viel mehr gibt’s eigentlich nicht dazu zu sagen – die Dokumentation dazu findet man, genau wie das Plugin selbst, unter http://plugins.jquery.com/project/timers.