drop-down-menu - 更改选择时的下拉颜色

Question

I have a dropdown which has different colours for each option, however when the option is chosen I would like the select background to change to the color I have chosen.

我找到了这个查询的答案，但是它使用内联样式，我想使用我的外部 CSS。

更改下拉列表中行的颜色

查看我的 JSFiddle

<select name="select" style="background-color: #ff0000" onchange="this.style.backgroundColor = this.options[this.selectedIndex].style.backgroundColor;">
 <option style="background-color: #ff0000" value="1">Red</option>
 <option style="background-color: #00ff00" value="2">Green</option>
 <option style="background-color: #0000ff" value="3">Blue</option>
</select>

Answer 1

如果你想使用外部 css，那么

<select name="select" class="Red" onchange="this.className = this.options[this.selectedIndex].className">
  <option class="Red" value="1">Red</option>
  <option class="Green" value="2">Green</option>
  <option class="Blue" value="3">Blue</option>
</select>

这是更新的jsfiddle