 Window definieren 02 Dateiname erst beim Aufruf festlegen
Das erste simple Script soll nun erweitert werden. Während im ersten Script die im Fenster anzuzeigende Datei von vorne herein festgelegt war, möchten wir nun die anzuzeigende Datei erst beim Aufruf der JavaScript-Funktion bestimmem. Die Größe für das Fenster belassen wir erst mal bei der festen Einstellung.
|
|
PopUp-Window definieren 02
|
Hier wollen wir nun eine PopUp-Window-Funktion entwerfen, der wir erst beim Aufruf mitteilen, welche HTML-Datei im Window angezeigt werden soll. So schaffen wir eine flexiblere Funktion die man mehrmals und zur Anzeige unterschiedlicher Inhalte einsetzen kann. Die Erklärungen dazu habe ich nun etwas weiter ausgeführt.
| |
erweitertes PopUp-Window-Script
Die JavaScript-Methode zum Öffnen einen PopUp-Windows nutzt 3 Argumente: Die Adresse der im Fenster dargestellten Seite (URI), den Namen des Windows und optional mehrere Attribute für die Eigenschaften des neuen Fensters.
Während die Eigenschaften 'Höhe' und 'Breite' des Fensters immer noch durch feste Angaben bestimmt werden, setzen wir statt des Dateinamens einen 'Platzhalter' ein. Wir ändern die Notierung aus dem Beispiel 1, wo der Dateiname (innnerhalb von Anführungszeichen) fest eingetragen war
fenster1=window.open('gelb.htm','infofenster','height=400,width=500');
in eine andere Notierung, wo lediglich der Name eines Platzhalters (ohne Anführungszeichen) eingetragen wird.
fenster1=window.open(dieURL,'infofenster','height=400,width=500');
Zwischenschritt zur Erklärung
Die Funktion zum Öffnen eines PopUp-Windows benötigt nun zur einwandfreien Funktion Informationen aus dem Platzhalter mit dem Namen 'dieURL', der die Angaben zu der Adresse der Datei enthält, die im Fenster angezeigt werden soll. Zur Veranschaulichung schaffen wir nun eine Variable und ordnen ihr die benötigten Informationen zu. Wir definieren eine Variable mit dem Namen 'dieURL'
<script type="text/javascript" language="JavaScript">
<!--
var dieURL = "gelb.htm";
function Fenster02(dieURL)
{
fenster1=window.open(dieURL,'infofenster','height=400,width=500');
}
// -->
</script>
Beim Aufruf dieser Funktion Fenster02() kann die Information darüber, welche Datei im Fenster angezeigt werden soll, der Variablen entnommen werden. Das ist in diesem Fall der Dateiname 'gelb.htm'. Genau diese Datei würde im Fenster angezeigt werden!
Damit haben wir nun die Angaben zur anzuzeigenden Datei nicht mehr fest innerhalb der Funktion verankert, sondern außerhalb der Funktion festgelegt. Nun gehen wir einen Schritt weiter und legen erst beim Aufruf der Funktion Fenster02() die Informationen zum Dateinamens fest. Der Fachmann nennt diese Technik "Übergabe eines Parameters".
Die neue PopUp-Window Funktion
Innerhalb der beiden Klammern hinter dem Namen der Funktion tragen wir die Bezeichnung des Platzhalters ein.
- Hier übernimmt die Funktion ein Parameter
- Den Namen des Parameters habe ih mit 'dieURL' selbst bestimmt
- 'dieURL' enthält später Informationen zum Dateinamen
- beim Aufruf der Funktion wird diese Information der Funktion übergeben
<script type="text/javascript" language="JavaScript">
<!--
function Fenster02(dieURL)
{
fenster1=window.open(dieURL,'infofenster','height=400,width=500');
}
// -->
</script>
Das Script wird im Head-Bereich der HTML-Datei oder in einer externen JS-Datei notiert und kann bei Bedarf (auch mehrmals) aufgerufen werden. Beim Aufruf müssen wir nun allerdings den Namen der anzuzeigenden Datei mittels Parameter übergeben. Das bedeutet, wir teilen der Funktion beim Aufruf mit, welche Datei im PopUp-Window angezeigt werden soll.
Erwartet eine Funktion Übergabeparameter, werden diese Parameter beim Aufruf der Funktion innerhalb der runden Klammern notiert. Hier erwartet die Funktion 'Fenster02()' lediglich 1 Parameter: Die Informationen zum Dateinamen.
Aus der simplen Notierung zum Aufruf einer Funktion ohne Parameter
Fenster02()
wird nun ein Funktionsaufruf mit dem Übergabe-Parameter für die Seitenadresse / des Dateinamens:
Fenster02('gelb.htm')
Fenster02('blau.htm')
a Aufruf der Funktion mit einem Link
Zum Vergleich noch einmal ein normaler Link:
<a href="gelb.htm"> Linktext </a>
Und nun der Link zum Aufruf einer JavaScript-Funktion:
So sieht der Aufruf der Funktion Fenster02() mit Übergabe des Dateinamens bei einem Link aus. Beachten sie: Der Funktionsaufruf steht in Anführungszeichen, der Dateiname in Hochkommas!
<a href="javascript: Fenster02('gelb.htm')"> Linktext </a>
<a href="javascript: Fenster02('gelb.htm')">Datei01 im Fenster anzeigen</a>
 Datei01 im Fenster anzeigen
Die Funktion kann man nun beliebig oft zur Anzeige unterschiedlicher Dateien verwenden. Lediglich der entsprechnde Dateiname muss eingetragen werden:
<a href="javascript: Fenster02('rot.htm')">Datei02 im Fenster anzeigen</a>
Datei02 im Fenster anzeigen
b Aufruf der Funktion beim Laden der HTML-Datei
Die Funktion kann auch gleich beim Laden der Seite aufgerufen werden!
Damit das Script beim Laden einer Seite automatisch gestartet wird (mit onLoad), fügen Sie eine entsprechende Anweisung als Ergänzung des <body>-Tags ein. Auch hier wird der Dateiname (steht in Anführungszeichen) übergeben
<body onLoad="Fenster02('rot.htm')"; bgcolor="#FFFFFF" ... >
 PopUp-Window Hintergrundwissen
PopUp-Window definieren 01
PopUp-Window Attribute
PopUp-Window flexible Größe
PopUp-Window Standard-Script
PopUp-Window deLuxe
|
Home • PopUp-Windows • Window definieren 02 
Quellcode