Sie sind hier: Home > Tricks > Javascript > Formulare - Vor...

Formulare - Vorgaben definieren

Stand vom 30.08.2002
Es macht durchaus Sinn, in Formularelemente beschreibende Inhalte als Anfangswert zu setzten, bei Klick auf das Element sollte dieser jedoch verschwinden, hat der Besucher nichts eingegeben, dann sollte dieser Text wieder erscheinen.

 Linktipps
 GPS Navigation   Webhosting inkl. Domain für Einsteiger und Profis.   AWD Erfahrung

Allgemein heißt die Direktive, die Seiten so einfach wie möglich, und so benutzerfreundlich wie möglich zu machen. Das fängt bei kleinen Funktionen bereits an. Einem Formularfeld, z.B. einem Textfeld kann man einen festen Anfangswert geben. Dieser sollte natürlich verschwinden, wenn der Besucher auf das Feld klickt. Es macht jedoch durchaus Sinn, das dieser wieder auftaucht, wenn der Benutzer keinen Text in das Feld gesetzt hat.



Klicken Sie in das Textfeld, und verlassen Sie es danach


Mit ein wenig JavaScript wird dies möglich:

<input name="name" value="Ihr Name" onfocus="if(this.value == 'Ihr Name') this.value='';" onblur="if (this.value=='') this.value='Ihr Name';">

Der Code ist recht einfach. Bei dem Event onfocus, was dem Zustand beim Klicken auf das Element beschreibt, wird der Inhalt aus dem value - Attribut des Eingabefeldes gelöscht, sofern dieser dem Anfangswert "Ihr Name" entspricht.
Dies wird durch eine if-Bedingung erreicht.
Der Eventhandler onblur beschreibt genau den anderen Zustand, nämlich beim verlassen des Objektes.
Der Inhalt aus dem Textfeld wird ermittelt, ist kein Inhalt vorhanden, welches durch onfocus der Fall geworden ist, dann wird der ursprüngliche Anfangswert "Ihr Name" wieder gesetzt. (tf)