Javascript 关闭时更改下拉列表的颜色

使用CSS，我可以为下拉“选择”列表的各个选项设置字体和背景颜色；但是，这些颜色仅在实际下拉列表中显示。列表未打开时，页面框中显示的颜色仍然是默认颜色

---

目前，我有一个列表，其中有许多下拉框，其中有一些选项，如果能够给每个选项上色，那么选择就会很明显。转换为单选按钮或其他输入并不真正可行。（我的客户相当挑剔。：-p）

如果这是一种安慰的话，我会做对的；）

您需要一些JavaScript才能在其他浏览器中工作：

<select onchange="this.style.backgroundColor=this.options[this.selectedIndex].style.backgroundColor">
    <option style="background-color:yellow">Item 1</option>
    <option style="background-color:lightyellow">Item 2</option>
</select>

这样，您就可以将演示文稿的详细信息分开，使类名有意义。

我在jQuery中做到了：

<select id="ddlColors" style="background-color: White;">
    <option style="background-color: Aqua;">1</option>
    <option style="background-color: Blue;">2</option>
    <option style="background-color: Fuchsia;">3</option>
    <option style="background-color: Gray;">4</option>
</select>
<script>
    $("select").change(function() {
        $("select").css("background-color", $("select option:selected").css("background-color"));
    })
    .change();
</script>

1.
2.
3.
4.
$（“选择”）.change（函数（）{
$（“选择”）.css（“背景色”），$（“选择选项：选定”）.css（“背景色”）；
})
.change（）；

.important { background-color:yellow; }
.sorta-important { background-color:lightyellow; }

<select id="ddlColors" style="background-color: White;">
    <option style="background-color: Aqua;">1</option>
    <option style="background-color: Blue;">2</option>
    <option style="background-color: Fuchsia;">3</option>
    <option style="background-color: Gray;">4</option>
</select>
<script>
    $("select").change(function() {
        $("select").css("background-color", $("select option:selected").css("background-color"));
    })
    .change();
</script>