template

Index :: Javascript :: Popup: Erzeugen

In manchen Fällen ist es vom Bedienungsablauf her sinnvoller, ein Popup-Fenster zu erzeugen, anstatt eine neue Seite in den Browser zu laden; nämlich immer dann, wenn das aktuelle Fenster nicht aus den Augen verloren werden darf.
Beispiele für die Verwendung eines Popups wären:
Die erforderlichen Javascript-Funktionen werden im HTML-Header der Seite notiert.

Hier wird das Dokument myinfo.php in ein Popup der Größe 200 x 200 geladen:
function PopIt() {
  window.open('myinfo.php', 'Info', 'width=200, height=200').focus(); 
}
Falls das Fenster mit dem Namen 'Info' bereits existiert, wird es als Container benutzt, ansonsten wird das Fenster 'Info' erzeugt.

Die Liste im 3. Parameter von window.open() kann bei Bedarf um weitere Eigenschaften ergänzt werden:
dependent=yes/no (Fenster bleibt auch ohne Focus im Vordergrund)
resizable=yes/no (Benutzer darf Fenstergröße ändern)
scrollbars=yes/no (Scrollbars einblenden, falls nötig)

Der Dateiname darf auch GET-Parameter besitzen.
Um die Info eines Benutzers mit einer bestimmten UserID anzuzeigen, könnte man folgende Funktion schreiben:
function UserInfo(uid) {
  window.open('userinfo.php?uid='+uid, 'Userinfo', 'width=200, height=200').focus(); 
}
Um die Funktion aufzurufen, benutzt man im HTML-Code einen Link
<a href='javascript:UserInfo(14)'>Hans Meier</a><br>
<a href='javascript:UserInfo(23)'>Gerda Schmidt</a><br>
<a href='javascript:UserInfo(9)'>Willi Busch</a><br>
oder einen Button:
<button type='button' onClick='javascript:UserInfo(14)'>Hans Meier</button>

Index :: Javascript


template