Angenommen man möchte ein Select-Feld nicht mit Texten ausgeben, sondern mit Farben und bei Auswahl einer Farbe soll dann das Select-Feld diese als Hintergrundfarbe annehmen:
<select name="foo">
<option value="FF6600" style="background-color: #FF6600"></option>
<option value="669900" style="background-color: #669900"></option>
</select> |
Leider funktioniert das nur im IE, jedoch nicht im Firefox (Opera und Safari hab ich nicht getestet …):
Per Javascript-Funktion kann man das Problem lösen:
<!-- innerhalb <head> --> <script type="text/javascript"> function chgBackgr(id) { slctField = document.getElementById(id); slctField.style.backgroundColor='#'+slctField.value; } </script> |
Der Aufruf geschieht dann wie folgt:
<select name="foo" id="foo" onchange="chgBackgr(foo)">
<option value="FF6600" style="background-color: #FF6600"></option>
<option value="669900" style="background-color: #669900"></option>
</select> |