JS Timer für IE 8
lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript
browser
code
date
demo
fehler
funktion
funktionieren
hell code
http
internet
letzten endes
normalfall
null
platzhalter
sekunde
start
uhr
url
verwenden
zweck
-
Hey
Ich suche irgendwie ne Möglichkeit, für den Internet Explorer 8 (es hat Gründe, warum ausgerechnet für den, fragt nicht), eine clock in Javascript zu implementieren.
Die gängigen Methoden wie setInterval usw. funktionieren meines Wissens nach nicht im IE8. deswegen hab ich versucht, meine eigene zu schreiben:
var TimeStart=Date.now(); var TimeEnd=TimeStart+600; function write(){ document.write(TimeEnd-Date.now()+'\n'); return true; } function timeMilliSeconds(){ var TimeLast = Date.now(); while((TimeEnd-Date.now()>0)){ if(Date.now()!=TimeLast){ if(write()){ TimeLast=Date.now();} } } } timeMilliSeconds();
Diese Uhr läuft 0,6 Sekunden. Letzten Endes will ich die Uhr 30 Sekunden ausführen, und in einem regelmäßigen Abstand (zb alle 0,2 Sekunden) eine Funktion ausführen (hier wird write(); als Platzhalter verwendet).
Leider klappt es bei mir mit dem o.g. source nicht ganz, die es wird erst in das Dokument geschrieben, wenn die Schleife schon durch ist, und dann aber auch tatsächlich jede millisekunde.
weiß jmnd, woran das liegt? bzw hat einen hinweis auf eine andere funktion, die ich verwenden kann?
(ist dringend, hab noch 16h Zeit dafür)
vielen Dank, snhth -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
-
Wenn es schnell gehen muss: Dann verwende jQuery. Das kommt mit nahezu allen Browsern klar. Auch dem Internet Explorer.
-
ich darf keine extra librarys einbinden :(
-
Für sowas gibt es normalerweise das "setTimeout": https://developer.mozilla.org/en-US/docs/Web/API/Window.setTimeout
Ich hab dir eine schnelle Klasse gebastelt, welche auch im IE8 funktionieren sollte (ich hab keinen IE8, und nichtmal den IE^^, sry):
window.Timer = function(argId, argTime) { var el = document.getElementById(argId); if (!el) {return null;} var running = false; var targetTime = null; var time = parseInt(argTime); function calcTimer() { var lasting = targetTime - (Date.now()/1000); var min = parseInt(lasting/60); var sec = parseInt(lasting%60); min = ((min+"").length==1) ? "0"+min : min; sec = ((sec+"").length==1) ? "0"+sec : sec; el.innerHTML = min + ":" + sec if (running && lasting > 0) {window.setTimeout(calcTimer, 500);} } this.start = function() { running = true; targetTime = (Date.now()/1000)+time; calcTimer(); } this.stop = function() { running = false; } this.setTime = function(argTime) { time = parseInt(argTime); } }
Diese Klasse kannst du nun benutzen indem du sagst:
<div id="timerElement"></div>
var timer1 = new window.Timer("timerElement", 10); // timerElement ist das Ziel, es soll 10 Sekunden runterzählen if (timer1 !==null) { timer1.start(); }
Den Timer könntest du jetzt noch mittels "stop" wieder stoppen, und mittels "setTimer" eine neue Zielzeit vorgeben, welche AB DER STARTZEIT gezählt wird.
Im normalfall sollte das im IE8 funktionieren, ich hab extra innerHTML genommen, weil textContent noch nicht unterstützt ist, und innerText nicht von jedem Browser unterstützt wird. Im normalfall sollte es funktionieren wie gewünscht.
Liebe Grüße -
ggamee schrieb:
...
Im normalfall sollte das im IE8 funktionieren, ich hab extra innerHTML genommen, weil textContent noch nicht unterstützt ist, und innerText nicht von jedem Browser unterstützt wird. Im normalfall sollte es funktionieren wie gewünscht.
...
Erstmal vielen Dank für den umfangreichen Code!
Funktioniert in Chrome super, auch wenn es nicht ganz das ist, was ich mir vorgestellt habe, aber das wäre nicht so schlimm (brauche das quasi als gametime für ein JS-spiel).
Doch leider scheint es im IE8 überhaupt nicht zu wollen :(
Ich vermute mal, das liegt an setTimeout();, da hab ich bei google viele andere gefunden, die meinten, das funktioniert da nicht.
Für meine Zwecke perfekt wäre sowas wie setInterval();, aber das funktioniert erst recht nicht.
btw, habe ich 24h mehr zeit bekommen ^^ -
Das
setTimeout
ist eigentlich bereits seit IE4 vorhanden.
Ich habe mir die Mühe gemacht, einen Windows7 Computer aufzugabeln, und dort im IE den Kompatiblitätsmodus für den IE8 und IE5 auf dieser Seite zu testen: http://ggamee.lima-city.de/ie8-timer.html
Startest du dein Javascript auch NACH dem "load" Event? Nicht, dass du bereits auf die Id zugreifen willst, obwohl das DOM Element noch garnicht vorhanden ist.
Ansonsten, poste doch mal eine Demo, wie du es benutzt, vllt liegt der Fehler ja woanders.
Liebe Grüße -
ggamee schrieb:
...
Ansonsten, poste doch mal eine Demo, wie du es benutzt, vllt liegt der Fehler ja woanders.
Liebe Grüße
Hab es quasi genau so benutzt, wie du geschrieben hast:
<html> <head> <title>The evil Browser from hell</title> <script type="text/javascript"> window.Timer = function(argId, argTime) { var el = document.getElementById(argId); if (!el) {return null;} var running = false; var targetTime = null; var time = parseInt(argTime); function calcTimer() { var lasting = targetTime - (Date.now()/1000); var min = parseInt(lasting/60); var sec = parseInt(lasting%60); min = ((min+"").length==1) ? "0"+min : min; sec = ((sec+"").length==1) ? "0"+sec : sec; el.innerHTML = min + ":" + sec if (running && lasting > 0) {window.setTimeout(calcTimer, 500);} } this.start = function() { running = true; targetTime = (Date.now()/1000)+time; calcTimer(); } this.stop = function() { running = false; } this.setTime = function(argTime) { time = parseInt(argTime); } } </script> </head> <body> <div id="timerElement"></div> <script type="text/javascript"> var timer1 = new window.Timer("timerElement", 60); if (timer1 !==null) { timer1.start(); } </script> </body> </html>
letzten endes will ich es hier anstelle von setInterval verwenden (vorvorletzte Zeile). Allerdings müsste ich den dann noch etwas umschreiben, sodass er ca alle 0,01 Sekunden die run()-Funktion aufruft.
Beitrag zuletzt geändert: 26.11.2013 14:25:03 von snhth -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
