Tips & Tricks: Die Message-Box |
Mit JavaScript können Sie in Verbindung mit Forumlar-Tags ohne großen Aufwand Nachrichten erzeugen. So ist es z.B. möglich, mit einem Button einen Hilfetext oder einen Hinweis anzeigen zu lassen.
<FORM>
<INPUT TYPE="button" Value=" Button " onClick="alert('Dies ist ein Nachricht mit Hilfe von JavaScript!')")>
</FORM>Mit der Anweisung onClick wird eine Aktion nach dem Anklicken eines definierten Buttons ausgeführt. In unserem Beispiel haben wir eine Nachricht definiert, die beim Anklicken (onClick) ausgeführt wird. Hierzu muß man onClick eine Aktion übergeben "alert('... Text ...')"). Der Beschriftungstext für den Button wird unter dem Wert Value="name" festgelegt.
Die Buttons selbst kann man in beliebiger Zahl anordnen. Nebeneinander, untereinander oder in einer Tabelle - wie auch immer. Man ist auch nicht auf den Button beschränkt. Es können auch Radiobuttons usw. verwendet werden:
<FORM>
<INPUT TYPE="radio" onClick="alert('Dies ist ein Nachricht mit Hilfe von JavaScript und dem radio-Button!')")>
<INPUT TYPE="checkbox" onClick="alert('Dies ist ein Nachricht mit Hilfe von JavaScript und der checkbox!')")>
</FORM>Wie man in diesem Beispiel erkennen kann, wurde einfach nur der TYPE enstprechend geändert. Nachfolgendes Beispiel zeigt wie man eine Nachricht in Verbindung mit einer Textarea erzeugen kann. Dies soll aber nur als Demo dienen und hat in diesem Fall keinen praktischen Nutzen mit der alert-Anweisung.
<FORM>
<TEXTAREA NAME="text" ROWS="3" COLS="30"></TEXTAREA>
<INPUT TYPE="button" VALUE="Klick mich!" onClick="alert(this.form.text.value)">
<INPUT TYPE="reset" VALUE="Reset">
</FORM>Der Name der Texarea wird als Formularname verwendet, um einen Nachricht durch die onClick Anweisung auszuführen. Im Aktions-Button muß die Anweisung wie folgt lauten: onClick="alert(this.form.text.value).
Als letztes Beispiel verwenden wir den onMouseOver Befehl.
Streifen Sie hier mit der Mouse oder über das Fernglas ...
![]()
<A HREF="" onMouseOver="alert('Dies ist eine Nachricht mit dem onMouseOver Befehl.')")> ... text ... </A>
<A HREF="" onMouseOver="alert('Dies ist eine Nachricht mit dem onMouseOver Befehl.')")><img src="internal-gopher-index" border=0 width=30 height=30></A>
Wie bei der Anweisung onClick, wird hier nach onMouseOver der "alert"-Text eingegeben. Der Verweis kann entweder ein Text oder ein Bild sein. Ein Verweisziel wird hier nicht angegeben - zumal es eh nicht ausgeführt werden kann.
BEACHTEN SIE: Wenn Sie ein Bild in JavaScript einbinden, so ist es notwendig immer Angaben zu Heights und Width zu machen. Werden diese Angaben weggelassen, so wir das JavaScript u.U. nicht ausgeführt.