PDA

Archiv verlassen und diese Seite im Standarddesign anzeigen : Javascript in HTML einbinden (und variablen übergeben?)


asterix88
02-06-2010, 09:23
Hallo zusammen.
ich habe etwas Erfarhung in HTML und bin Neuling in Java-Script. Ich habe mir aus dem Internet einen Countdownzähler zusammengebastelt, welcher funktioniert. Das Skript habe ich in einer .js-Datei und die binde ich in die .html-Datei ein. Das Script sieht so aus:

var CountdownJahr = 2010;
var CountdownMonat = 10;
var CountdownTag = 8;

function CountdownAnzeigen()
{
var Jetzt = new Date();
var Countdown = new Date(CountdownJahr, CountdownMonat-1, CountdownTag);
var MillisekundenBisCountdown = Countdown.getTime()-Jetzt.getTime();
var Rest = Math.floor(MillisekundenBisCountdown/1000);
var CountdownText = "";

if(Rest >= 31536000)
{
var Jahre = Math.floor(Rest/31536000);
Rest = Rest-Jahre*31536000;
}

if(Rest >= 86400)
{
var Tage = Math.floor(Rest/86400) + (Jahre*365);

// plus einen Tag, weil vorher Stunden gerechnet wurden
if(Tage > 1) CountdownText += (Tage + 1) + " Tage";
}

if(Rest <= 0) CountdownText += " ";
document.getElementById('Countdown').innerHTML = CountdownText;
window.setTimeout("CountdownAnzeigen()", 1000);
}

So binde ich das Script in die html-Datei ein:

...
<script type="text/javascript" src="name.js"></script>

...
<body onLoad="CountdownAnzeigen();">

...
<span id="Countdown"></span>
...


Durch die Konstruktion mit dem span wird dann im Browser der Countdown (also die Tage) angezeigt. Ich verstehe es nicht, aber es funktioniert...

Ich möchte jetzt mit EINEM Skript mehrere solcher Countdowns erzeugen. Ich habe mir das so vorgestellt, dass ich mit einem Aufruf in der .html-Datei Variablen übergebe (Jahr, Monat, Tag) und das Script mir dann das Ergebnis zurück gibt. Geht das? Wie?

ich hoffe, ihr versteht was ich meine :rolleyes:
mfg asterix
msi
02-06-2010, 18:58
zB so:


function starteCounter( id, CountdownJahr, CountdownMonat, CountdownTag) {

function update() {

var Jetzt = new Date();
var Countdown = new Date(CountdownJahr, CountdownMonat-1, CountdownTag);
var MillisekundenBisCountdown = Countdown.getTime()-Jetzt.getTime();
console.log(MillisekundenBisCountdown);

var Rest = Math.floor(MillisekundenBisCountdown/1000);
var CountdownText = "";

var Jahre = 0;

if(Rest >= 31536000 ) {
Jahre = Math.floor(Rest/31536000);
Rest = Rest-Jahre*31536000;

}

if(Rest >= 86400) {
var Tage = Math.floor(Rest/86400) + (Jahre*365);

// plus einen Tag, weil vorher Stunden gerechnet wurden
if(Tage > 1) CountdownText += (Tage + 1) + " Tage";
}

if(Rest <= 0) CountdownText += " ";
document.getElementById(id).innerHTML = "xx"+ CountdownText;
window.setTimeout( update , 1000);
}

update();

}




<body onload="starteCounter('counter1', 2010,10,5);starteCounter('counter2', 2010,8,5);starteCounter('counter3', 2011,10,5);" >


<span id="counter1"></span> g
<span id="counter2"></span> g
<span id="counter3"></span>
asterix88
03-06-2010, 16:34
schonmal danke für deine Hilfe. Ich weiß nicht, ob ich mich zu blöd anstelle, aber es geht bei mir nicht :-(

ich habe zu Testzwecken einfach den Javscript-Code in eine .js-Datei kopiert, und in einer .html-Datei das Skript verlinkt, und den <body>-Tag angepasst. Außerdem habe ich die 3 Zeilen mit dem <span> hineinkopiert. Es erscheinen im Browser aber nur die beiden "g". Haben die "g" nen Sinn?
msi
03-06-2010, 18:41
die g haben keinen sinn,
hast wohl etwas falsch abgetippt oder verlinkt.
was sagt dnen deine fehlerkonsole, zeig deinen code her.
asterix88
04-06-2010, 13:10
jetzt gehts :-)
In der Firefox-Fehler-Konsole stand, dass in Zeile 9 die Fehlerkonsole nicht definiert sei. Also habe ich die Zeile auskommentiert, und schon funktioniert alles :) (Fehler: console is not defined Quelldatei: http://localhost/test/ skript.js Zeile: 9)

Dann sage ich nochmal danke für die Mühe :-)