jquery - 更改选择背景以匹配所选选项背景

Question

我在这里有一个简单的查询：

我用 2 种不同颜色的选项构建了一个简单的选择：红色和绿色。

.green { color: #217A23; }
.red    { color: #AA0000; }

<select id="select">
    <option class='green'>green</option>
    <option class='red'>red</option>
</select>

我希望选择文本 WHEN CLOSED 以匹配所选文本的颜色。

因此，在下拉菜单中选择绿色后，我希望选择文本也为绿色。现在，我可以选择绿色文本，但是当菜单关闭时，“绿色”这个词仍然是黑色的。

这需要jQuery来做吗？

http://jsfiddle.net/8zkx9yu0/

标签： jqueryselectoption

Answer 1

使用以下代码：

$("#select").on('change',(e)=>{
 // to make backgroud color
    $('body').css({background:e.target.value});
   $(e).removeClass().addClass($(e).find("option:selected").attr("class"););
})

在此处输入代码