Experiment: Kohlkopf

+Übersicht
+Tools & Links
+HTML-Allgemein
+Tabellen & Layer
-JavaScript/DOM
Browser-Unterschiede
Variablenübergabe
Weiterleitungen
PopUp-Fenster
Dateien auslesen
<select>-Wert ermitteln
Zugriff auf Fenster
2 Aktionen im Formular
<textarea>-Zeichenlimit
statisch positionieren
Bilderwechsel
Image-Preload
Zufallszahlen
+CSS
+Frames
+Diverses


 
Valid CSS!
Valid HTML 4.01!
 
 
zum Provisorium

 > Übersicht der Fragen
   > JavaScript/DOM
     > Zugriff auf Fenster
 
 
Wie kann ich mit Javascript auf andere Frames oder Fenster zugreifen?
 

Auf andere Fenster ist ein Javascript-Zugriff nur möglich, wenn diese entweder von jener Seite, von welcher man zugreifen möchte, mittels der window.open()-Methode geöffnet wurden, oder wenn man von einem so erzeugten Fenster auf das Ursprungsfenster zugreift.

Beispiel
Zugriff auf Funktionen, Variablen und Dokumente in anderen Fenstern:

Quelltext des Elternfensters


<html>
<head>
<title>Javascript-Zugriff auf Popup-Fenster</title>
<script type="text/javascript">
<!--
var popup=false;
function FensterAuf()
{
popup=window.open('popup.html','win','width=200,height=300,top=50,left=552');
}

function Nachricht()
{
if(popup&&!popup.closed)
  {
  popup.txt='Klick den Button!';
  popup.enableForm();
  }
}

function FensterZu(obj)
{
if(obj&&!obj.closed)
  {
  obj.close();
  }
}
//-->
</script>
</head>
<body>
  <a href="javascript:FensterAuf()">Fenster &Ouml;ffnen</a><br>
  <a href="javascript:Nachricht()">Nachricht im PopUp ausgeben</a><br>
  <a href="javascript:FensterZu(popup);">Popup-Fenster Schliessen</a>
</body>
</html>

Erläuterung:

Das Elternfenster enthält 3 Links, über die 3 im <head> der Seite notierte Javascript-Funktionen aufgerufen werden.

Die Funktion FensterAuf() öffnet ein Popupfenster. Dieses Fenster wird in der zuvor deklarierten Variable popup gespeichert. Zum einen kann man dadurch im Folgenden ermitteln, ob das Popup-Fenster überhaupt existiert, und zum Anderen ist damit der Zugriff auf dieses Fenster möglich.

Die Funktion Nachricht() setzt den Wert der im Popup-Fenster deklarierten Variable txt mit popup.txt='Klick den Button!'; neu und ruft eine Funktion namens enableForm() über popup.enableForm(); auf.
Aus diesen Anweisungen geht hervor, wie der Zugriff per Javascript auf Fenster erfolgt.... man referenziert es, in diesem Fall mit popup, gefolgt von einem Punkt und der Javascript-Anweisung.
Die Abfrage if(popup&&!popup.closed) soll dabei das Entstehen eines Fehlers verhindern, wenn das Popup-Fenster noch nicht geöffnet oder bereits wieder geschlossen wurde. Dabei erfragt if(popup), ob der Wert dieser Variablen false ist. Dies ist nur der Fall, wenn die Funktion FensterAuf() noch nicht aufgerufen wurde, da innerhalb dieser Funktion der Inhalt der Variablen popup neu gesetzt wird. Mit if(!popup.closed) wird im Gegensatz dazu ermittelt, ob das Fenster zwar geöffnet, aber bereits wieder geschlossen wurde.

Letztendlich wendet die Funktion FensterZu() die close() Methode auf das Fenster an, .....welche das Fenster schliesst.


tip   Die close()- Methode arbeitet nur problemlos bei Fenstern, welche auch mit Javascript geöffnet wurden. Ist dies nicht der Fall, erfolgt vor dem Schliessen des Fensters eine Sicherheitsabfrage des Browsers.

Quelltext des Popup-Fensters


<html>
<head>
<title>Javascript-Zugriff auf Popup-Fenster</title>
<script type="text/javascript">
<!--
txt='';
function enableForm()
{
document.forms[0].elements[0].value=txt;
document.forms[0].elements[1].disabled=false;
}

function eingabe()
{
deinName = prompt("Geben deinen Namen ein","");
if(deinName.match(/\w/))
  {
      opener.document.open();
      opener.document.write('Hallo, '+deinName);
      opener.document.close();
      opener.focus();
   }
}

//-->
</script>
</head>
<body>
<form>
<input type="text"size="20">
<input type="button"value="dr&uuml;ck mich"disabled="disabled"onclick="eingabe();">
</form>
</body>
</html>

Erläuterung:

Das Kindfenster, im Allgemeinen "Popup" genannt enthält ein Formular mit einem leeren Textfeld und einem deaktivierten Button.
Von vornherein besteht in diesem Fenster nicht die Möglichkeit, die im <head> der Seite notierten Javascript-Funktionen auszuführen. Zum Einen ist für die FunktionschreibeNachricht() kein Aufruf vermerkt, zum Anderen ist der Aufruf der Funktion eingabe() nicht möglich, da der betreffende Button ausser Funktion ist.

Um diesen Button zu Aktivieren, muss im Elternfenster über den entsprechenden Link die Funktion Nachricht() aufgerufen werden, welche im Popupfenster wiederum die Funktion enableForm() aufruft. Diese belegt das Eingabefeld im Poupfenster mit dem durch das Elternfenster neu gesetzten Wert der anfangs leeren Variable txt und aktiviert den Button, wodurch nun im Popupfenster der Aufruf der Funktion eingabe() möglich wird.

Diese Funktion wiederum startet ein Eingabefenster, infolgedessen in das Elternfenster mit opener.document.write() ein neues Dokument beschrieben wird. Daraus wird ersichtlich, wie er Zugriff von Kindfenstern auf deren Elternfenster erfolgt: mit dem Schlüsselwort opener kann man jederzeit auf das Ursprungsfenster zugreifen, sofern das aktuelle Fenster per Javascript geöffnet wurde. Wie man an dem Beispiel sieht, ist es so auch möglich, komplett neue Dokumente zu erzeugen, ohne dass diese als Datei vorhanden sein müssen... im Beispiel wurde zwar auf ein HTML-Grundgerüst verzichtet, es ist aber problemlos möglich, komplette Webseiten durch diese Methode "aus dem Nichts" zu erzeugen.



Etwas anders gestaltet sich der Zugriff auf verschiedene Frames

Da es über die Frameset-Definition möglich ist, <frame>'s bereits mit HTML-Miiteln mit einem Namen auszustatten, ist es möglich, diese Frames und die darin enthaltenen Dokumente über diesen Namen anzusprechen:

Ansprechen von Frames vom obersten, das Frameset beinhaltenden Fenster aus:

  • window.framename
    -ansprechen des Frames framename als Fenster
  • window.framename.document
    -ansprechen des Dokumentes im Frame framename
  • window.framename.variable
    -ansprechen der Javascript-Variable variable im Frame framename
  • window.framename.funktionsname()
    -ausführen der Javascript-Funktion funktionsname im Frame framename

Analog dazu spricht man aus Dokumenten innerhalb einzelner Frames andere Frames mit dem Schlüsselwort top an.

  • top.framename2
    -ansprechen des Frames framename2 als Fenster
  • top.framename2.document
    -ansprechen des Dokumentes im Frame framename2
  • top.framename2.variable
    -ansprechen der Javascript-Variable variable im Frame framename2
  • top.framename2.funktionsname()
    -ausführen der Javascript-Funktion funktionsname im Frame framename2

 
 
   
beantwortet von
doktormolle
 
 
zum proVisorium Impressum