2009-03-17 21 views
1
<select class="FunctieSelect"> 
<option class="yellow" value="-1">- kies -</option> 
<option class="yellow" value="1">KSZ functie</option> 
<option class="yellow" value="2">Bakker</option> 
<option class="yellow" value="3">Schilder</option> 
<option class="yellow" value="4">Andere</option> 
</select> 

сопциона удаляется при выборе опции

.yellow 
{ 
    background-color: Yellow; 
} 

производит следующий вывод:

alt text http://thomasstock.net/selectCss.JPG

В действительности, только один из вариантов будет иметь желтый фон , поэтому установка css на выбор не поможет мне

=> Как сделать параметр желтым, когда он выбран?

Я знаю, что возможное решение использует jquery для совершения события «изменения», проверки события изменения, которое выбрано, и затем установите css выбора. Но мне интересно, есть ли более простое решение.

ответ

3

Согласовано с Андреем. Еще одна вещь, о которой вы могли бы подумать, заключается в том, что юзабилити снижается, когда вы меняете стили элементов формы. Если вы хотите обозначить измененную часть формы, вы можете просто выделить поле вокруг выбора.

+0

Сетка, которую я разрабатываю, будет использоваться ровно 1 раз несколькими тысячами компаний. В сетке они должны изменить функцию/работу своих сотрудников. –

+0

Одна из функций - это функция поменять «поменять» по умолчанию, и мы хотим показать ее желтым цветом, чтобы указать, что ее по-прежнему нужно изменить с помощью раскрывающегося списка. Есть ли у вас другое предложение о том, как мы могли бы это указать? Я думаю, что мой предыдущий код jquery является лучшим решением. –

+0

Я уверен, что код jQuery будет работать, я бы предпочел выделить вокруг окна выбора, используя myselectbox.parentNode.className + = "yellow" , Если вы должны окрасить сам элемент формы, то, возможно, jQuery - это путь. –

4

К сожалению, вы видите, что поведение браузера по умолчанию не имеет переопределения CSS. Есть несколько вариантов, доступных вам - возможно, что-то вроде Taming the select будет полезно?

+0

благодарит за полезную ссылку –

1

Если вы хотите выбрать стиль, я бы предложил заменить их чем-то вроде JQuery Flexbox (demo). Если нет, они будут отображаться по-разному в браузерах & платформ.

+0

спасибо, я мог бы использовать это в другом проекте –

Смежные вопросы