Input-Felder Inhalt bei Mausklick ausblenden mit externer Datei

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

  1. Jakob

    Jakob Thread Starter MacUser Mitglied

    Beiträge:
    1.067
    Zustimmungen:
    21
    MacUser seit:
    05.01.2004
    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

    Beiträge:
    367
    Zustimmungen:
    0
    MacUser seit:
    03.08.2004
    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

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

    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!
     
Die Seite wird geladen...

Diese Seite empfehlen