Просмотр полной версии : выпадающий список и цвета
Доброго времени суток, можно ли реализовать следующее и как:
есть у нас select, в нем при нажатии на выбранную позицию грузятся данные, так вот, проблема в том что мне надо если мы позицию посмотрели, обозначать ее цветом - что мы в ней уже были, и т.д. с другими позициям - если возможно, подскажите как, спасибо
доброго) можно еще подкрутить, но смысл примерно такой
var options = document.getElementsByTagName("option");
for(var i = 0; i < options.length; i++)
options[i].onclick = function() {this.style.backgroundColor = "red";};
можно также достать из DOM ваш select и у него есть свойство-массив options
var list = document.getElementsByTagName("select")[0]; // или дать ему id
for(var i = 0; i < list.options.length; i++)
list.options[i].onclick = function() {this.style.backgroundColor = "red";};
можно после того как на него нажмут сделать элемент больше недоступным для выделения
var options = document.getElementsByTagName("option");
for(var i = 0; i < options.length; i++)
options[i].onclick = function() {this.style.backgroundColor="red"; this.disabled = true;}
чудесно, но что-то не получается:
<form name="namePos">
<select name="select1" size="1">
<option>Position1</option>
<option>Position2</option>
<option>Position3</option>
</select></form>
и код JS:
<script type="text/javascript">
var options = document.getElementsByTagName("option");
for(var i = 0; i < options.length; i++)
options[i].onclick = function() {this.style.backgroundColor="red"; }
</script>
выбераю Position1, далее если выбераю Position2, то Position1 по идее должен выделятся красным цветом (в смысле посещен был уже) и т.д., что-то Ваш JS не работает
Alfer,
Cуть в том, что у option нет раздельного background,
он един для всех option и ставиться только на <select>
Поэтому подобные выпадающие cелекты с окраской эмулируют <li> списками , пробуйте поискать в Инете
о да. оно работает только firefox и opera. не знал, извиняюсь
Ребят, добился следующего:
<select id="posSelect">
<option value="0" >Position1</option>
<option value="1" >Position2</option>
<option value="2" >Position3</option>
<option value="3" >Position4</option>
</select>
и код JS:
<script type="text/javascript">
$('#make-it-slick').on('click', function(){
$('#posSelect').ddslick();
});
$('#restore').on('click', function(){
$('#posSelect').ddslick('destroy');
});
</script>
но есть проблема, к примеру, мы выбрали Position 3, после выбора у нас Position 3 в списке выделен, а нужно к примеру еще если мы потом выбрали Position 4, то и Position 4 и Position 3 должны быть подсвечены цветом, что нужно поправить?
vBulletin® v3.6.7, Copyright ©2000-2025, Jelsoft Enterprises Ltd. Перевод: zCarot