✔ Hilfe beim Ausfüllen eines Formulars einblenden

W

webix

Mitglied
Guten Tag,

ich suche die Möglichkeit, beim Ausfüllen eines Formulars Informationstexte einzublenden.

Kennt jemand von Euch, entweder ein Programm (zum Erstellen von Formularen), ein Tutorial (zu diesem Thema) oder ein fertiges JavaScript?

Beispiel:

Der User klickt in das Feld Passwort, neben dem Feld Passwort erscheint eine Infobox ("Ein Passwort besteht aus x Zeichen und darf nicht länger als y Zeichen sein.")
 
HTML: 
<html><head>
     
     <script type="text/javascript"><!--
     
 	function swap(id) {
  		if (document.getElementById) {
  			Obj = document.getElementById(id);
  			Obj.style.display = (Obj.style.display=='none') 
  					? 'inline' 
  					: 'none';
  		}
  	}
     
     //--></script>
     
     </head><body>
     	Passwort:
     	<input type="text" onfocus="swap('passwd')" onblur="swap('passwd')"/>
     		<span id="passwd" style="display:none">
 			Ein Passwort besteht aus x Zeichen und darf nicht länger als y Zeichen sein.
     		</span>
     		<br />
     	
     	Name:
     	<input type="text" onfocus="swap('Name')" onblur="swap('Name')"/>
     		<span id="Name" style="display:none">
 			Bitte zuerst den Nachnamen, dann mit einem Komma ( , ) getrennt den Vornamen.
     		</span>
     
  </body></html>
Die Funktion "swap(id)" macht ein HTML Element mit der id="id" sichtbar, wenn es unsichtbar ist bzw. andersherum.

Du fügst den Text, den du einbelnden willst an die entsprechende Stelle im Dokument (z.B. neben den Formularfeldern) innerhalb eines <span>- oder sonstwie gearteten Tags ein. Diesem Tag gibst du eine id (im Beispiel oben die id="passwd"). Damit der Text standartmäßig erstmal ausgeblendet ist gibst du im das Attribut style="dispaly:none".

Das Eingabefeld, das ihn einblenden soll ruft dann mittels "onfocus" (wenn der User das Feld aktiviert) und "onblur" (wenn der User es verlässt) die Funktion "swap()" mit dem entsprechden ID-Parameter (im Beispiel oben onfocus="swap('passwd')" ) auf.

Das sollte es eigentlich sein. Viel Spaß beim ausprobieren, hab's nicht getestet.
 
Zuletzt bearbeitet:
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück