oncklick in <option> ???

[Gunnar Bittersmann]

@@Sveno:

nuqneH

ich möchte wie oben zu sehen mit <option> und onclick ein Textfeld ausblenden, aber ich krieg es einfach nicht hin.

Im Firefox funktioniert’s. In Chrome nicht.

Stattdessen: Auf das change-Event des select-Elements reagieren und die Sichtbarkeit entsprechend seines value ändern. Dirty (nicht so machen!):

<select onchange="[code lang=javascript]document.getElementById('demo').style.display = (this.value == 'anzeigen') ? 'block' : 'none';">
    <option>anzeigen</option>
    <option>verbergen</option>
</select>[/code]

Da gibt es einiges zu verbessern:

(1) Man sollte keinen JavaScript-Code ins HTML schreiben, sondern Eventhandler in JavaScript definieren.

Im HTML steht lediglich

<select id="visibility-switcher">  
    <option value="visible">anzeigen</option>  
    <option value="hidden">verbergen</option>  
</select>

Im JavaScript:

var demoElement = document.getElementById("demo"),  
    visibilitySwitcherElement = document.getElementById("visibility-switcher");  
  
visibilitySwitcherElement.addEventListener("change", function (event)  
{  
    // dazu kommen wir gleich  
}, false);

(2) Man sollte mit JavaScript keine CSS-Eigenschaften ändern, sondern Informationen ins DOM bringen.

Man könnte dem demo-Element z.B. den Wert des select-Elements als Klasse verpassen:

visibilitySwitcherElement.addEventListener("change", function (event)  
{  
    demoElement.className = event.target.value;  
}, false);

Den Rest erledigt das Stylesheet:

.hidden  
{  
    display: none;  
}

(3) Man sollte Elemente nicht unbedingt mit display: none verstecken.

Also die Regel für .hidden doch etwas anders.

Qapla'