Probleme mit der Javascript Uhr

[Der Martin]

Hallo,

Leider wird nur die Uhrzeit von der ersten Uhr angezeigt ...

<script language="JavaScript">
<!--

das hast du bestimmt in irgendeinem Antiquariat gefunden. Das language-Attribut kannst du streichen, dafür fehlt das erforderliche type="text/javascript". Den HTML-Kommentar kannst du auch weglassen. Der hilft nichts, aber es gibt Situationen, wo er Probleme machen könnte.

function Uhr_anzeigen(){
function Uhr_anzeigen(){
function Uhr_anzeigen(){

Wenn du dreimal eine Funktion mit demselben Namen definierst und sie irgendwann mit Uhr_anzeigen() aufrufst, welche von den drei Funktionen wird dann wohl gemeint sein?

<form NAME="uhr">
<input TYPE="text" NAME="zeit" SIZE=10 VALUE ="">
</form>

Hier ist mir unklar, warum du das Textfeld in ein Formular packst - und wieder drei Formulare mit identischen Namen benutzt. Damit ist ja auch die Adressierung der Felder über document.uhr.zeit nicht mehr eindeutig.

und ich weiß auch nicht wie ich die Zeitverschiebung von Dubai mit + 3Std. und Shanghai mit +7 Std. einbinden muss.
Zu meine Schande muss ich gestehen, das ich nicht Programmieren kann.

Das ist schade, aber keine Schande.  ;-)
Nur sollte man in der Unkenntnis nicht davon ausgehen, dass man durch einfaches Zusammenkleben verschiedener Code-Fragmente wieder etwas Funktionierendes bekommt.

Also langsam. Du brauchst eine Funktion, die für verschiedene Zeitzonen die Uhrzeit bestimmt. Also wäre es doch naheliegend, die Zeitzone (Offset in Stunden gegen UTC) als Argument zu übergeben. Innerhalb der Funktion müssen wir dann zunächst die aktuelle Systemzeit in UTC ermitteln, und dann auf die gewünschte Zeitzone umrechnen.

function Uhr(zeitzone)
 { var Datum = new Date();                    // ergibt Datum in lokaler Zeitzone
   Datum -= Datum.getTimezoneOffest()*60000;  // normiert Datum auf UTC
   Datum += zeitzone*60*60000;                // verschiebt auf gewünscht Zeitzone
                                              // weiter wie bisher

Zur Erläuterung: Mit new Date() lesen wir die aktuelle Systemzeit aus, die aber auf die Zeitzone des Client-Rechners bezogen ist. Die rechnen wir jetzt auf UTC um, indem wir mit getTimezoneOffset() die Zeitverschiebung gegen UTC abfragen und subtrahieren. Da getTimezoneOffset() einen Wert in Minuten zurückliefert, das Date-Objekt aber in Millisekunden "denkt", müssen wir den erhaltenen Wert mit 60*1000 multiplizieren. Im zweiten Schritt rechnen wir den erhaltenen Zeitstempel nun auf die gewünschte Zeitzone um. Das Prinzip ist dasselbe - eine simple Addition. Da ich vergeschlagen habe, die Zeitzone als Anzahl der *Stunden* gegen GMT zu übergeben, müssen wir hier mit 60*60*1000 multiplizieren, um auf die Millisekunden zu kommen.

document.uhr.zeit.value = Zeit

Das würde ich so nicht machen. Gib lieber den zusammengebauten String als Funktionsergebnis zurück:

return (Zeit);

timerid = setTimeout("Uhr_anzeigen()",1000)

Und auch das (das zyklische Wieder-Aufrufen) würde ich außerhalb der Funktion veranlassen. Lass das hier erstmal weg.

}-8

Was soll übrigens das "-8" nach der abschließenden Funktionsklammer? Weg damit! Wir haben also bis jetzt eine Funktion, die man mit Uhr(t) aufrufen kann, und die uns als Ergebnis die Uhrzeit für die Zeitzone t (Stunden gegen UTC) zurückliefert. Fein.

Jetzt kannst du im HTML-Code die Textfelder vorsehen. Ich gebe ihnen im Beispiel mal allen den gleichen Namen, obwohl ich das bei dir erst kritisiert habe. Ich komme auch gleich nochmal darauf zurück.

<p><label>Mitteleuropa:</label><input type="text" name="zeit"></p>
<p><label>Dubai:</label>       <input type="text" name="zeit"></p>
<p><label>Shanghai:</label>    <input type="text" name="zeit"></p>

Nun fehlt uns "nur" noch die Kontroll-Logik. Hier spreche ich übrigens die gleichnamigen input-Elemente an, indem ich mit getElementsByName() erst ein Array erhalte, in dem alle Elemente dieses Namens vertreten sind, und sie dann über den Index [0..n] auswähle.

function UhrenAnzeigen()
 { var inputs = document.getElementsByName("zeit");
   inputs[0].value = Uhr(+1);  // Uhrzeit für Mitteleuropa
   inputs[1].value = Uhr(+3);  // Uhrzeit für Dubai
   inputs[2].value = Uhr(+7);  // Uhrzeit für Shanghai
   setTimeout("UhrenAnzeigen()", 500);
 }

Zum Schluss noch dafür sorgen, dass nach dem Laden des Dokuments die Funktionen auch einmal angestoßen werden:

window.onload = UhrenAnzeigen;

Eine generelle Sache ist mir noch aufgefallen: In Javascript ist es in vielen Fällen erlaubt, das Semikolon am Ende einer Anweisung wegzulassen, wenn es mit einem Zeilenumbruch zusammenfällt. Um Ärger zu vermeiden, empfehle ich trotzdem, konsequent Semikola zu setzen.

Außerdem empfehle ich dir noch, zum Verständnis der Funktionsweise die einzelnen Funktionen, Methoden und Objekte im JS-Kapitel von SELFHTML nachzulesen.

Schönen Sonntag noch,
 Martin