1. Diese Seite verwendet Cookies. Wenn du dich weiterhin auf dieser Seite aufhältst, akzeptierst du unseren Einsatz von Cookies. Weitere Informationen

Input-Felder Inhalt bei Mausklick ausblenden mit externer Datei

Dieses Thema im Forum "Web-Design" wurde erstellt von Jakob, 23.02.2005.

  1. Jakob

    Jakob Thread Starter MacUser Mitglied

    Mitglied seit:
    05.01.2004
    Beiträge:
    1.067
    Zustimmungen:
    21
    Hallo,

    nen typisches Beispiel um den vorgegebenen Inhalt (value) eines Input-Felds auszublenden, wenn man anklickt und wieder rein, wenn man rausklickt ohne was zu schreiben ist ja so:
    HTML:
    <input size="15" id="Suchbegriff" value="Suche..." onfocus="if (this.value=='Suche...') this.value='';" onblur="if (this.value=='') this.value='Suche...';" />
    Wobei die Dinger bei this.value=''; zwei ' sind und kein ".

    Wie bekomm ich das denn hin, wenn ich ganz standards-compliant das JavaScript auslagern möchte?
    Das Feld sieht also so aus:

    HTML:
    <input size="15" id="Suchbegriff" value="Suche..." />
    Das Skript parst die Seite und gibt allen Inputfeldern dieses Verhalten.
    Irgendwelche Ideen?

    Danke!
     
  2. Nogger

    Nogger MacUser Mitglied

    Mitglied seit:
    03.08.2004
    Beiträge:
    367
    Zustimmungen:
    0
    Die zu ändernden Elemente mit einer Klasse versehen. Mittels getElementsByTagName() eine Kollektion aller input-Elemente holen. Über die Kollektion iterieren. Wenn das Element der gesuchten Klasse angehört ( Eigenschaft className prüfen), dem Element das onfocus/onblur Verhalten mittels der onfocus/onblur Eigenschaften zuweisen. Den Text muß dabei übrigens nicht fest kodiert sein, die defaultValue Eigenschaft enthält den Wert des value-Attributs des Elements zum Zeitpunkt der Erzeugung.

    Die Implementation ist trivial und sei zur Übung überlassen ;-)
     
  3. Jakob

    Jakob Thread Starter MacUser Mitglied

    Mitglied seit:
    05.01.2004
    Beiträge:
    1.067
    Zustimmungen:
    21
    :(

    Die letzte halbe Stunde hab ich für dieses triviale Stück gebraucht.

    Also so weit bin ich:
    Code:
    if (document.getElementById){
    var blup = function() {
    	var input = document.getElementsByTagName("input");
    			for (var i = 0; i < input.length; i++) {
    				if(input.type=='text'){
    				input.onfocus=this.value='';
    			}
    		}
    	}
    }
    window.onload = blup;
    Wie man dem recht stümperhaftem Code-Stückchen entnehmen kann, würde ich gerne bei allen text-inputs das Verhalten haben.
    Es klappt aber nicht. Auch ohne das if(input.type=='text') nicht. Die Zeile da drunter sieht auch eher falsch aus, aber sehe nicht wie das sonst gehen soll.

    Kannst Du mir nochmal nen Tipp geben? Danke!