Automatischer Refresh in Java

[Christoph]

Hallo,

in Sachen Javascript bin ich ein absoluter Newbie. Ich habe auf einer Website ein recht einfaches Script eingebaut, das die Ortszeiten verschiedener Orte berechnet. Die jeweils aktuelle Zeit wird also angezeigt, wenn die Seite neu geladen wird.
Am liebsten wäre es mir, die Uhren würden automatisch weiterlaufen, leben könnte ich auch mit einer Lösung, die bei einem Klick die einzelnen Werte neu berechnet, nicht aber die gesamte Seite neu lädt.
Gibt es da Möglichkeiten?

Vielen Dank für Eure Hilfe, das (wahrscheinlich viel zu umständliche aber zu meiner Freude funktionierende) Script lautet wie folgt:

<SCRIPT language=JavaScript>

var berl = 1;
  var singa = 8;
  var sydn = 11;

var jetzt = new Date ();
  var LokZ = jetzt.getTime();
  var ZeitV = jetzt.getTimezoneOffset() * 1000 * 60;
  var utc = LokZ + ZeitV;

var berlZV = berl * 60 * 60 * 1000;
  var singaZV = singa * 60 * 60 * 1000;
  var sydnZV = sydn * 60 * 60 * 1000;

var berlZeit = utc + berlZV;
  var singaZeit = utc + singaZV;
  var sydnZeit = utc + sydnZV;

var Wochentag = new Array("So, ","Mo, ","Di, ","Mi, ","Do, ","Fr, ","Sa, ");

var berlOZ = new Date();
  berlOZ.setTime(berlZeit);

var berlWoTa = berlOZ.getDay();

var berlTag = berlOZ.getDate();
  var berlMona = berlOZ.getMonth() + 1;
  var berlJahr = berlOZ.getYear() % 100;

var berlStun = berlOZ.getHours();
  var berlMinu =berlOZ.getMinutes();

if(berlTag < 10) berlTag="0"+berlTag;
  if(berlMona < 10) berlMona="0"+berlMona;
  if(berlJahr < 10) berlJahr="0"+berlJahr;

if(berlStun < 10) berlStun="0"+berlStun;
  if(berlMinu < 10) berlMinu="0"+berlMinu;

document.write("<table border=0 width=185 cellspacing=0 cellpadding=0>");
      document.write("<tr>");
        document.write("<td width=185>");
          document.write("<b>Berlin</b>");
        document.write("</td>");
        document.write("<td width=200 align=right valign=middle>");
          document.write("<font size=1> (GMT+1h)</font>");
        document.write("</td>");
      document.write("</tr>");

document.write("<tr><td colspan=3>");
        document.write(Wochentag[berlWoTa] + berlTag + "." + berlMona + "." + berlJahr + " - " + berlStun + ":" + berlMinu + " Uhr");
      document.write("</td></tr>");
    document.write("</table>");

document.write("<hr noshade width=185 size=1 align=right color=#951919>");

var singaOZ = new Date();
  singaOZ.setTime(singaZeit);

var singaWoTa = singaOZ.getDay();

var singaTag = singaOZ.getDate();
  var singaMona = singaOZ.getMonth() + 1;
  var singaJahr = singaOZ.getYear() % 100;

var singaStun = singaOZ.getHours();
  var singaMinu =singaOZ.getMinutes();

if(singaTag < 10) singaTag="0"+singaTag;
  if(singaMona < 10) singaMona="0"+singaMona;
  if(singaJahr < 10) singaJahr="0"+singaJahr;

if(singaStun < 10) singaStun="0"+singaStun;
  if(singaMinu < 10) singaMinu="0"+singaMinu;

document.write("<table border=0 width=185 cellspacing=0 cellpadding=0>");
      document.write("<tr>");
        document.write("<td width=185>");
          document.write("<b>Singapur</b>");
        document.write("</td>");
        document.write("<td width=200 align=right valign=middle>");
          document.write("<font size=1> (GMT+8h)</font>");
        document.write("</td>");
      document.write("</tr>");

document.write("<tr><td colspan=3>");
        document.write(Wochentag[singaWoTa] + singaTag + "." + singaMona + "." + singaJahr + " - " + singaStun + ":" + singaMinu + " Uhr");
      document.write("</td></tr>");
    document.write("</table>");

document.write("<hr noshade width=185 size=1 align=right color=#951919>");

var sydnOZ = new Date();
  sydnOZ.setTime(sydnZeit);

var sydnWoTa = sydnOZ.getDay();

var sydnTag = sydnOZ.getDate();
  var sydnMona = sydnOZ.getMonth() + 1;
  var sydnJahr = sydnOZ.getYear() % 100;

var sydnStun = sydnOZ.getHours();
  var sydnMinu =sydnOZ.getMinutes();

if(sydnTag < 10) sydnTag="0"+sydnTag;
  if(sydnMona < 10) sydnMona="0"+sydnMona;
  if(sydnJahr < 10) sydnJahr="0"+sydnJahr;

if(sydnStun < 10) sydnStun="0"+sydnStun;
  if(sydnMinu < 10) sydnMinu="0"+sydnMinu;

document.write("<table border=0 width=185 cellspacing=0 cellpadding=0>");

document.write("<tr>");
        document.write("<td width=185>");
          document.write("<b>Sydney</b>");
        document.write("</td>");
        document.write("<td width=200 align=right valign=middle>");
          document.write("<font size=1> (GMT+11h)</font>");
        document.write("</td>");
      document.write("</tr>");

document.write("<tr><td colspan=3>");
        document.write(Wochentag[sydnWoTa] + sydnTag + "." + sydnMona + "." + sydnJahr + " - " + sydnStun + ":" + sydnMinu + " Uhr");
      document.write("</td></tr>");

document.write("</table>");

document.write("<hr noshade width=185 size=1 align=right color=#951919>");

document.write("<tr><td colspan=3>");
        document.write("<font size=1><b>Zeiten aktualisieren?<br>F5 drücken!</b></font>");
      document.write("</td></tr>");
document.write("</td></tr>");

document.write("</table>");

</script>

Christoph

[Biesterfeld]

Hej Christoph,

Am liebsten wäre es mir, die Uhren würden automatisch weiterlaufen, leben könnte ich auch mit einer Lösung, die bei einem Klick die einzelnen Werte neu berechnet, nicht aber die gesamte Seite neu lädt.

Pack den Code in eine Funktion und schau dir mal setInterval() an. Is genau was Du suchst.

Kurz zu deinem code, dieses Monstrum solltest Du am besten auf das nötigste reduzieren, insbesondere wenn er sekündlich ausgeführt wird. Einmal fällt mir auf, dass du viel zu viel Variablen deklarierst, nur ein Beispiel:

var berl = 1;
  var singa = 8;
  var sydn = 11;

var jetzt = new Date ();
  var LokZ = jetzt.getTime();
  var ZeitV = jetzt.getTimezoneOffset() * 1000 * 60;
  var utc = LokZ + ZeitV;

var berlZV = berl * 60 * 60 * 1000;
  var singaZV = singa * 60 * 60 * 1000;
  var sydnZV = sydn * 60 * 60 * 1000;

var berlZeit = utc + berlZV;
  var singaZeit = utc + singaZV;
  var sydnZeit = utc + sydnZV;

äquivalent zu:

var jetzt = new Date ();
  var utc = jetzt.getTime() + jetzt.getTimezoneOffset() * 60000;
  var berlZeit = utc + 3600000;
  var singaZeit = utc + 2880000;
  var sydnZeit = utc + 39600000;

Darüber hinaus würde ich mir überlegen ob es sinnvoll ist mehrmals pro Funktionsaufruf Date() zu instanzieren.

document.write("<table border=0 width=185 cellspacing=0 cellpadding=0>");
      document.write("<tr>");
        document.write("<td width=185>");
          document.write("<b>Berlin</b>");
        document.write("</td>");
        document.write("<td width=200 align=right valign=middle>");
          document.write("<font size=1> (GMT+1h)</font>");
        document.write("</td>");
      document.write("</tr>");

Zweitens, ist es ganz und gar nicht nötig, dass du für deine Uhr immer wieder dynamisch eine neue Tabelle schreibst. Schreibe die Tabelle einmal in html und überschreibe lediglich den Tabelleninhalt neu.
Schau dir dazu mal createTextNode() an.

Drittens, überlege dir align, valign und fontsize durch css zu ersetzen.

Ach und Viertens, Java hat nicht wirklich viel mit JavaScript zu tun ;)

Beste Grüße
Biesterfeld

[Christoph]

Alles klar, ich werde mich dann mal weiter einfuddeln. Vielen Dank!