Question

如何更改下拉菜单的颜色。就像我有一个带有5个选项的下拉菜单，当我点击一个选项时，我希望该选项改变颜色，以便我可以跟踪我已选择的选项。（5这里是假设，我有更大的列表，IP和端口为字段，所以不记得我检查过的所有字段。）

让我们假设我的下拉是

<select>
    <option val="">Please choose</option>
    <option val="1">Option 1</option>
    <option val="2">Option 2</option>
    <option val="3">Option 3</option>
    <option val="4">Option 4</option>
    <option val="5">Option 5</option>
</select>

Answer 1

＆＃13;

var select = document.getElementById('select');
select.onchange = function() {
  select.options[select.selectedIndex].style.backgroundColor = 'red';
}

var clean = document.getElementById('clean');
clean.onclick = function() {
    for(var i = 0; i < select.options.length; i++) {
      select.options[i].style.backgroundColor = '';  
    }
}

＆＃13;

<select id="select">
    <option val="">Please choose</option>
    <option val="1">Option 1</option>
    <option val="2">Option 2</option>
    <option val="3">Option 3</option>
    <option val="4">Option 4</option>
    <option val="5">Option 5</option>
</select>

<button type="button" id="clean">Clean</div>

＆＃13;

Answer 2

试试这个

 $('yourdropdownid option:selected').css('background-color', 'red');

Answer 3

在这里：

DEMO

$('select option').click(function(){
    $(this).css('background','yellow');   
});

在选择下更改下拉菜单的背景颜色

3 个答案:

DEMO