✔ Problem mit setTimeout.

VioX

VioX

Mitglied
Hallöchen.

ich bin gerade dabei, einen Countdown bis zu den Ferien zu schreiben. Dieser ist im Grunde schon fertig, doch ich habe noch ein kleines Problem.
Ich möchte, dass das Script alle Sekunde neu geladen wird und zwar mit Hilfe der settimeout funktion (wenn es eine andere möglichkeit gibt, soll sie bitte genannt werden ;) )

Der Text, also die verbleibende Zeit, wird zwar ausgegeben, aber nicht neu geladen.

Ich glaube es ist am günstigsten, wenn ich einfach mal den Code poste.
Bitte wundert euch nicht über meine Programmierweise ;P
Ich denke, dass erscheint merkwürdig, dass ich mittendrin PHP reingepackt hab^^


Code: 
<html>
<body>
<tr>
<div id="countdownout"></div>
<script type="text/javascript">
<?

$ferienzeit = mktime(10, 20, 0, 6, 20, 2008);
$timestamp = time();

?>

function countdown() {

var total, secs, mins, hours, days, weeks
var now, nowtime, nowdate, ferien, ferientime, feriendate

total = <? echo mktime(10, 20, 0, 6, 20, 2008) - time(); ?>;
nowtime = "<? echo date("H:i",$timestamp); ?>";
nowdate = "<? echo date("d.m.Y",$timestamp); ?>";
ferientime = "<? echo date("H:i",$ferienzeit); ?>";
feriendate = "<? echo date("d.m.Y",$ferienzeit); ?>";
now = nowdate + " - " + nowtime + " Uhr";
ferien = feriendate + " - " + ferientime + " Uhr";



<?
$diffDate = mktime(10, 20, 0, 6, 20, 2008) - time();
$days = floor($diffDate / 24 / 60 / 60 );
$weeks = floor($days / 7);
$diffDate = $diffDate - ($days*24*60*60);
$hours = floor($diffDate / 60 / 60);
$diffDate = $diffDate - ($hours*60*60);
$minutes = floor($diffDate/60);
$diffDate = $diffDate - ($minutes*60);
$seconds = floor($diffDate);
?>

days = "<? echo $days; ?>";
weeks = "<? echo $weeks; ?>";
hours = "<? echo $hours; ?>";
mins = "<? echo $minutes; ?>";
secs = "<? echo $seconds; ?>";

var output = "Bis zu den Ferien sind es noch " + days + " Tage (" + weeks + " Wochen), " + hours + " Stunden, " + mins + " Minuten, " + secs + " Sekunden";
countdownout.innerHTML = output;

}

function ausgabe() {
countdown();
setTimeout("ausgabe()",1000);
}
ausgabe();


</script>
</tr>
</html>

Ich danke euch jetzt schonmal
Gruß
 
Zuletzt bearbeitet:
Hi,

vielleicht ist es geschickter, die Zeitdifferenz mit PHP in eine JavaScript-Variable zu schreiben und diese herunter zu zählen. So ruftst du die Funktion mit setTimeout erneut auf und sparst dir und dem Benutzer somit das ständige Neuladen.

Hier ein Beispiel, dass als Countdown bis zum Jahreswechsel geschrieben wurde.
Code: 
<html>
<head>
<title>www.tutorials.de</title>
<meta name="author" content="Quaese">
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<script type="text/javascript">
// Sekunden mit PHP initialisieren
var lngSekunden = <?php echo(mktime(0, 0, 0, 1, 1, 2009) - time()); ?>;

function startCountdown(){
  var intTage = Math.floor(lngSekunden/(60*60*24));
  lngHelpSekunden = lngSekunden - intTage*60*60*24;

  var intStunden = Math.floor(lngHelpSekunden/(60*60));
  intStunden = (intStunden < 10) ? "0"+intStunden : intStunden;
  lngHelpSekunden = lngHelpSekunden - intStunden*60*60;

  var intMinuten = Math.floor(lngHelpSekunden/60);
  intMinuten = (intMinuten < 10) ? "0"+intMinuten : intMinuten;

  var intSekunden = lngHelpSekunden - intMinuten*60;
  intSekunden = (intSekunden < 10) ? "0"+intSekunden : intSekunden;

  var strZeit = intTage + " Tage, " + intStunden + ":" + intMinuten + ":" + intSekunden;

  document.getElementById("countdownID").innerHTML = strZeit;

  lngSekunden--;

  if(lngSekunden >= 0)
    window.setTimeout("startCountdown()", 1000);
}

window.onload = function(){
  startCountdown();
}
</script>
</head>
<body>
<div id="countdownID"></div>
</body>
</html>
Vielleicht hilft dir das weiter.

Ciao
Quaese
 
Darüber habe ich auch schon nachgedacht. Wäre vermutlicher praktischer, jedoch müsste ich das Script sogut wie von neu schreiben.

Werde ich auch machen denk ich.
Eine andere Möglichkeit gibt es wohl nicht?





Danke an Quaese :)
 
Hi,

du müsstest doch das Script aus meinem ersten Posting nur um die Berechnung und Ausgabe der Wochen erweitern.

Ciao
Quaese
 
Hi,

wenn du tatsächlich das Dokument jede Sekunde neu laden willst, kannst du statt
Code: 
setTimeout("ausgabe()",1000);
folgendes probieren
Code: 
window.setTimeout(function(){ location.reload(); }, 1000);
Ciao
Quaese
 
OK, das funktioniert, ist aber nicht ganz das, was ich wollte.

Ich werde es wohl schnell neu schreiben müssen.



Dankeschön! :)
 
Ganz ehrlich, ein reload ist nicht hübsch. Die Aufgabe ist auch nicht so schwer, als dass Du sie nicht ohne Reload schnell mal hinbastelst.

mfg chmee
 
Ja wie gesagt, ist nicht das was ich wollte ;)
So ein reload ist wirklich nicht hübsch und vorallem nervig.







Gruß
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück