PDA

Archiv verlassen und diese Seite im Standarddesign anzeigen : Programmieren mit JavaScript


Werbung

Amolithis
22-07-2007, 09:19
Hallo! :wink:


Ich habe versucht, mit Hilfe eines Online-Tools einen Countdown zu programmieren. Hat bisher auch ganz gut geklappt. Nun wollte ich den Countdown etwas "verfeinern" und nun komme ich nicht weiter.


Hier mal der Quelltext des Programms:


<html>
<head>
<title>Datum-Countdown mit JavaScript</title>

<script type='text/javascript'>
// Erstellt mit dem Countdown-Generator - Homepage-Total.de
var end = new Date('December 24, 2007 22:00:00');
function toSt2(n) {
s = '';
if (n < 10) s += '0';
return (s + n).toString();
}
function toSt3(n) {
s = '';
if (n < 10) s += '00';
else if (n < 100) s += '0';
return (s + n).toString();
}
function countdown() {
d = new Date();
count = Math.floor(end.getTime() - d.getTime());
if(count > 0) {
miliseconds = toSt3(count%1000); count = Math.floor(count/1000);
seconds = toSt2(count%60); count = Math.floor(count/60);
minutes = toSt2(count%60); count = Math.floor(count/60);
if (minutes < 10)
minutes = (minutes * 10)/10;
hours = toSt2(count%24); count = Math.floor(count/24);
if (hours < 10)
hours = (hours * 10)/10;
days = count;
if (days == 0) {
document.getElementById('c1').innerHTML = 'Noch'
document.getElementById('c2').innerHTML = hours + ' Stunde(n) und ' + minutes + ' Minute(n)'
document.getElementById('c3').innerHTML = 'bis zum xxx!'
setTimeout('countdown()', 50);
}
if (hours == 0)
document.getElementById('c1').innerHTML = 'Noch'
document.getElementById('c2').innerHTML = days + ' Tag(e) und ' + minutes + ' Minute(n)'
document.getElementById('c3').innerHTML = 'bis zum xxx!'
setTimeout('countdown()', 50);
}
if (minutes == 0) {
document.getElementById('c1').innerHTML = 'Noch'
document.getElementById('c2').innerHTML = days + ' Tag(e) und ' + hours + ' Stunde(n)'
document.getElementById('c3').innerHTML = 'bis zum xxx!'
setTimeout('countdown()', 50);
}
if (minutes != 0 && hours != 0 && days != 0) {
document.getElementById('c1').innerHTML = 'Noch'
document.getElementById('c2').innerHTML = days + ' Tag(e), ' + hours + ' Stunde(n) und ' + minutes + ' Minute(n)'
document.getElementById('c3').innerHTML = 'bis zum xxx!'
setTimeout('countdown()', 50);
}
}
else
document.getElementById('c1').innerHTML = 'xxx ist eingetroffen!'

}
</script>

<body onload='countdown();'>

<div align=center>
<SPAN id=c1 style="FONT: bold 30px arial; COLOR: green;"></SPAN><br>
<SPAN id=c2 style="FONT: bold 25px arial; COLOR: blue;"></SPAN><br>
<SPAN id=c3 style="FONT: bold 20px arial; COLOR: black;"></SPAN><br>
</div>

</head>

</html>


Es geht hauptsächlich um den fettgedruckten Bytecode, dort scheint irgendein Fehler zu liegen. Weiß jemand, wie ich das richtig hinbekomme? Wenn ich nämlich den oben abgedruckten Bytecode im Browser öffne, wird nur eine blanke Seite angezeigt!


Außerdem würde ich gerne "unter" dem ersten Countdown gerne noch einen zweiten in dem HTML-Dokument einbauen. Wie würde das gehen? Einfach den gesamten Quelltext vom Script kopieren und einfügen?


Vielen Dank schonmal für eure Hilfe! :wink:

can_rebooted
22-07-2007, 09:36
if (minutes != 0 && hours != 0 && days != 0) {
document.getElementById('c1').innerHTML = 'Noch'
document.getElementById('c2').innerHTML = days + ' Tag(e), ' + hours + ' Stunde(n) und ' + minutes + ' Minute(n)'
document.getElementById('c3').innerHTML = 'bis zum xxx!'
setTimeout('countdown()', 50);
}
else
{
document.getElementById('c1').innerHTML = 'xxx ist eingetroffen!'
}
}


vor dem else ist eine geschweifte klammer zuviel und nach dem else hatten´se auch gefehlt. das script lief zwar bei mir - allerdings musste ich den firefox dann scharf abschiessen. stichpunkt firefox - dort gibt es eine fehlerkonsole zum überwachen deiner scripts ;)

http://1mb.at/uploads/22.07.2007_10:39:15_fehlerkonsole.jpg

hoppla ... in der nachbetrachtung sind mir noch ein paar dinge aufgefallen:


<body onload='countdown();'>

<div align=center>
<SPAN id=c1 style="FONT: bold 30px arial; COLOR: green;"></SPAN><br>
<SPAN id=c2 style="FONT: bold 25px arial; COLOR: blue;"></SPAN><br>
<SPAN id=c3 style="FONT: bold 20px arial; COLOR: black;"></SPAN><br>
</div>

</head>

</html>
das ist so falsch ... richtig wäre:



</head>
<body onload='countdown();'>

<div align=center>
<SPAN id=c1 style="FONT: bold 30px arial; COLOR: green;"></SPAN><br>
<SPAN id=c2 style="FONT: bold 25px arial; COLOR: blue;"></SPAN><br>
<SPAN id=c3 style="FONT: bold 20px arial; COLOR: black;"></SPAN><br>
</div>

</body>
</html>
</head> muss vor <body> und </body> vor </html>

Amolithis
22-07-2007, 09:45
if (minutes != 0 && hours != 0 && days != 0) {
document.getElementById('c1').innerHTML = 'Noch'
document.getElementById('c2').innerHTML = days + ' Tag(e), ' + hours + ' Stunde(n) und ' + minutes + ' Minute(n)'
document.getElementById('c3').innerHTML = 'bis zum xxx!'
setTimeout('countdown()', 50);
}
else
{
document.getElementById('c1').innerHTML = 'xxx ist eingetroffen!'
}
}



vor dem else ist eine geschweifte klammer zuviel und nach dem else hatten´se auch gefehlt. das script lief zwar bei mir - allerdings musste ich den firefox dann scharf abschiessen. stichpunkt firefox - dort gibt es eine fehlerkonsole zum überwachen deiner scripts ;)


Danke dir! :)


Nun ist es aber so, dass wenn ich die zweite Klammer vor dem "else" weglasse, dann läuft das Programm falsch! Das heißt, wenn keine der If-Bedingungen erfüllt ist, wird zur Else-Klammer übergegangen, das sollte aber nur der Fall sein, wenn die Funktion "if(count > 0)" nicht erfüllt ist, also müsste da eigentlich die Klammer bleiben. Oder denke ich da falsch?



Danke auch für den Tipp mit Firefox! Wie rufe ich diese Konsole auf?

can_rebooted
22-07-2007, 09:47
Nun ist es aber so, dass wenn ich die zweite Klammer vor dem "else" weglasse, dann läuft das Programm falsch! Das heißt, wenn keine der If-Bedingungen erfüllt ist, wird zur Else-Klammer übergegangen, das sollte aber nur der Fall sein, wenn die Funktion "if(count > 0)" nicht erfüllt ist, also müsste da eigentlich die Klammer bleiben. Oder denke ich da falsch?
also irgendwie gerät da was in eine endlosschleife ... der browser fädelt sich jedemal auf, wenn ich das script starte ... von den if...else-blöcken ist aber soweit alles okay jetzt ... meiner meinung nach ...


Danke auch für den Tipp mit Firefox! Wie rufe ich diese Konsole auf?
Extras -> Fehlerkonsole

Amolithis
22-07-2007, 09:57
Extras -> Fehlerkonsole


Danke! :)


Mittlerweile habe ich den Fehler selbst entdeckt:


(...)
if (hours == 0) {
document.getElementById('c1').innerHTML = 'Noch'
document.getElementById('c2').innerHTML = days + ' Tag(e) und ' + minutes + ' Minute(n)'
document.getElementById('c3').innerHTML = 'bis zum xxx!'
setTimeout('countdown()', 50);
}
if (minutes == 0) {
document.getElementById('c1').innerHTML = 'Noch'
document.getElementById('c2').innerHTML = days + ' Tag(e) und ' + hours + ' Stunde(n)'
document.getElementById('c3').innerHTML = 'bis zum xxx!'
setTimeout('countdown()', 50);
}
if (minutes != 0 && hours != 0 && days != 0) {
document.getElementById('c1').innerHTML = 'Noch'
document.getElementById('c2').innerHTML = days + ' Tag(e), ' + hours + ' Stunde(n) und ' + minutes + ' Minute(n)'
document.getElementById('c3').innerHTML = 'bis zum xxx!'
setTimeout('countdown()', 50);
}
}
else
document.getElementById('c1').innerHTML = 'xxx ist eingetroffen!'
(...)


Beim Vergleich "if (hours == 0)" fehlte die öffnende geschweifte Klammer! ;)



Weißt du auch, wie man mehrere Countdowns hintereinander in ein HTML-Dokument einbaut?

denti
22-07-2007, 15:37
Da fehlen doch auch ein Haufen Semikolons an den Zeilenenden. Läuft das echt in IE und Firefox? Ich kann's kaum glauben.

Amolithis
22-07-2007, 16:26
Läuft das echt in IE und Firefox? Ich kann's kaum glauben.


Jepp, das läuft wirklich.



Weiß jemand eine Antwort auf meine 2. Frage? Also, wie man mehrere Countdowns in eine HTML-Datei bekommt?