jquery - 在选择中更改默认选项的颜色

Question

我正在尝试自定义 select，但我无法使用 css 更改 default 选项的颜色。

我尝试使用 .choose-flat__select option[default] 和 .choose-flat__select option:first-child，但没有帮助。

请看例子:https://jsfiddle.net/1v76mvo7/

此外，我尝试使用 jQuery 更改它:

$("#year-ready").find("option:first").attr("default", true).css('color', 'gray');

但没有成功。

是否可以使用 CSS 更改颜色？

更新:

我认为描述有点不正确。我希望 default 选项(在我的例子中是“Year...”)在被选中时具有 gray 颜色: ，但如果我选择其他选项，它们应该有 black 颜色:

Answer 1

据我了解，您想更改所选选项的颜色。如果是，则尝试以下 css。

.choose-flat__select
{
  color: yourColorCode;
}  

FIDDLE DEMO HERE

更新

根据您更新的问题，您可以使用 Javascript 执行此操作。

$("#year-ready").change(function() {
   var val = $(this).val();
   if(val == yourDefaultValue)
   {
       $(this).addClass("default");
   }
   else
   {
      $(this).removeClass("default");
   }
});

在你的css中添加样式

.default
{
    color: gray;
}

UPDATED FIDDLE HERE