| <- Vorlesung 7 | Übungen | Vorlesung 9 -> |
var jetzt = new Date(); document.write(jetzt.getTime());Dies schreibt den momentanen Zeitpunkt in die Variable jetzt. Dies ist der Zeitpunkt, der auf der Uhr des Clients angezeigt wird. Die Methode getTime() gibt dann die Anzahl der Millisekunden an, die vom 1.1.1997 um 0 Uhr bis zu dem in
Man kann das neue Date-Objekt aber nicht nur mit dem momentanen Zeitpunkt erzeugen, sondern auch mit einem beliebigen anderen Zeitpunkt:
dann = new Date(1999,11,24);setzt z.B. die Variable dann auf Weihnachten 1999. Dies ist etwas gewöhnungsbedürftig: Die Monate werden von 0 an gezählt, d.h. 0=Januar,1=Februar,...
Das Format lautet also:
variable = new Date(Jahr, Monat, Tag);Noch genauer kann der Zeitpunkt mit
variable = new Date(Jahr, Monat, Tag, Stunden, Minuten, Sekunden);eingestellt werden. Auch hier wird mit 0 bei den Monaten zu zählen begonnen.
Nun kann man rechnen
var jetzt = new Date();
var dann = new Date(1999,11,24);
var d = (dann.getTime() - jetzt.getTime())/1000;
document.write("Bis Weihnachten haben wir noch "+d+" Sekunden");
Man kann auch individuelle Information
abrufen:
| getTime() | Zeit in Millisekunden seit dem 1.1.19970 |
| getDate() | Monatstag ermitteln |
| getDay() | Wochentag ermitteln |
| getHours() | Stunde ermitteln |
| getMinutes() | Minute ermitteln |
| getMonth() | Monat ermitteln |
| getYear() | Jahr ermitteln |
Der Zeitpunkt eines Date-Objekts kann auch neu gesetzt werden:
| setTime() | Zeit mit Millisekunden besetzen |
| setDate() | Monatstag setzen |
| setDay() | Wochentag setzen |
| setHours() | Stunden setzen |
| setMinutes() | Minuten setzen |
| setMonth() | Monat setzen |
| setYear() | Jahr setzen |
Achtung: Hier kann es zu einer Art Jahr2000-Fehler kommen:
var zeit = new Date(); var y = zeit.getYear();Daraufhin enthält y den Wert 99. Will man den Wert des Jahres um 1 erhöhen:
zeit.setYear(y+1);so wird als Jahreszahl statt 2000 die Zahl 100 gesetzt! Abhilfe vorher evtl. die Variable y um 1900 erhöhen.
Klickt der Benutzer z.B. auf einen Button, so bekommt JavaScript die Meldung, daß das Ereignis "Klick auf Button" eingetreten. JavaScript ermittelt, welcher Button geklickt wurde, und falls für diesen Button vom Benutzer eine individuelle Reaktion vorgesehen wurde, wird diese ausgeführt.
Ein Beispiel:
<FORM>
<INPUT TYPE=button VALUE="Klick" onClick="alert('Hallo');">
</FORM>
Folgende Standard-Ereignisse kennt JavaScript, allerdings sind
nicht alle Ereignisse für jedes graphische Objekt relevant. Außerdem
kennt nicht jede Version jedes Browsers all diese Ereignisse, bzw.
es gibt evtl. weitere Ereignisse.
| Event | Beschreibung | Tags |
| onAbort | Anwender drückt auf STOP, bevor alle Bilder geladen wurden. | IMG |
| onBlur | Element verliert den Fokus | hauptsächlich BODY, INPUT, SELECT, TEXTAREA |
| onChange | Benutzer verändert Eintrag | INPUT, SELECT, TEXTAREA |
| onClick | Benutzer klickt auf Element | hauptsächlich BUTTON, aber viele weitere |
| onFocus | Element erhält Focus, siehe onBlur | |
| onLoad | Tritt ein, nachdem eine HTML-Datei vollständig geladen wurde. | BODY, FRAMESET |
| onMouseover | tritt ein, wenn die Maus über das Element geführt wird | ursprünglich A, AREA, mittlerweile sehr viele andere Elemente |
| onReset | Beim Auslösen des Reset-Befehls in einem Formular | FORM |
| onSelect | tritt ein, wenn der Benutzer Text selektiert | INPUT, TEXTAREA |
| onSubmit | tritt ein, wenn ein Formular abgeschickt wird | FORM |
| onUnload | tritt ein, wenn eine HTML-Datei verlassen wird | BODY, FRAMESET |
Ein Beispiel:
Man definiert zwei Funktionen start und ende.
var s,e;
function start() {
s = new Date();
}
function ende() {
e = new Date();
var d = (e.getTime() - s.getTime())/1000;
alert("Sie waren "+d+" Sekunden bei mir!");
}
Diese Funktionen werden im BODY-Tag nach dem Laden der Seite, bzw.
beim Verlassen der Seite aufgerufen.
<BODY onLoad="start();" onUnload="ende();" >
Beispiel:
Falls der Benutzer mit der Maus über einen Verweis fährt, wird in der Statuszeile ein entsprechender Text angezeigt:
<A HREF="xxx.htm" onMouseover="status='Klick mich';">Verweis</A>Man kann mit diesen Event-Handlern die Funktionsweise von HTML-Objekten an seine Bedürfnisse anpassen. Dazu muß man JavaScript mitteilen, ob die ursprünglich vorgesehene Aktion noch ausgeführt werden soll. Nochmal das obige Beispiel:
<A HREF="xxx.htm" onClick="alert('Klick mich');">Verweis</A>
Beim Klicken auf den Verweis wird ein Meldungsfenster gezeigt, und danach
auf die Seite xxx.html gesprungen. Wenn man nur das Meldungsfenster
angezeigt haben will, so muß man zusätzlich return false
an JavaScript zurückgeben:
<A HREF="xxx.htm" onClick="alert('Klick mich');return false;">Verweis</A>
Dadurch wird verhindert, daß der Link verfolgt wird.
Ein deutlicheres Beispiel dazu ist onSubmit. Wir können z.B. nochmals nachfragen, ob ein Formular wirklich abgeschickt werden soll.
<FORM ... onSubmit="return confirm('wirklich abschicken?'">
...
</FORM>
confirm() erzeugt wie alert ein Meldungsfenster. Zusätzlich
wird true oder false zurückgegeben, je nachdem ob
auf OK oder Abbruch geklickt wird.
| <- Vorlesung 7 | Übungen | Vorlesung 9 -> |