Question

我想更改所选选项的文本颜色=“已选择”：

    <select class="select">
        <option value="--">--</option>
        <option value="2014">2014</option>
        <option value="2013">2013</option>
        <option value="2012" selected="selected">2012</option>
        <option value="2011">2011</option>
    </select>

我一直在尝试使用CSS，但似乎不可能：

    .select select [selected="selected"]{
        color: #2b2b2b;
    }

jQuery的任何想法？

Answer 1

我一直在尝试使用CSS，但似乎不可能：

由于您的目标是select标记而非option标记，因此该选择符意味着选择嵌套在具有select .select <的元素内的任何class元素/ p>

select option[selected] {
    color: red;
}

Demo

您正在使用class，因此您可以创建一个像

这样的选择器

.select option[selected] {
   color: red;
}

Answer 2

尝试

$('.select').change(function () {
            $(this).find('option:selected').css('background-color', 'red');
});

用于更改文字颜色使用

  $(this).find('option:selected').css('color', 'red');

<强> FIDDLE

Answer 3

喜欢这个

<强> demo

<强> JS

    $('.select').change(function () {
    $(this).find('option').css('color', '#000000');
    $(this).find('option:selected').css('color', '#ff0000');
}).trigger('change');

Answer 4

你可以这样做：

 $('.select option:selected').css('color','#2b2b2b');

或者如果您想在每次更改select选项时触发事件，您可以执行以下操作：

$('.select').change(function () {
     $(this).find('option:selected').css('color','#2b2b2b');
});

或只是简单的css：

select option:checked {
     color: #2b2b2b;
}

Answer 5

.select option:checked {
    color: red;
}

不确定此浏览器的兼容性..

修改：https://developer.mozilla.org/en-US/docs/Web/CSS/:checked

更改所选选项的颜色 - jQuery

5 个答案: