有下拉彩色背景一直存在，一旦選定

<select> 
 
    <option value="apple" style="background: red">Apple</option> 
 
    <option value="banana" style="background: yellow">Banana</option> 
 
    <option value="pear" style="background: green">Pear</option> 
 
</select>

所以我有一個HTML下拉與有背景顏色選擇。但是，一旦我從列表中選擇這些選項之一，背景顏色將消失...

有沒有辦法讓它如此，一旦選項被選中，背景色仍然存在？

來源

2017-07-06 LOL. NO.

您想在選擇選項後留下背景色嗎？ – ISHIDA

正確。當我選擇它時，背景會恢復爲默認（白色？） –

我已創建一個JSFiddle

以下是代碼：

.Red { 
 
    background-color: #ff0000; 
 
} 
 

 
.Green { 
 
    background-color: #00ff00; 
 
} 
 

 
.Blue { 
 
    background-color: #0000ff; 
 
}

<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>

來源

2017-07-06 18:34:19 ISHIDA

<select style="background:pink"> 
    <option value="apple" style="background: red">Apple</option> 
    <option value="banana" style="background: yellow">Banana</option> 
    <option value="pear" style="background: green">Pear</option> 
</select>

選擇的項目是在DOM完全是另外一個對象，其他樣式應用到它。您可以使用JavaScript或JQuery來獲取所選選項的顏色，並將其應用於所選項目。

來源

2017-07-06 18:34:26

有下拉彩色背景一直存在，一旦選定

回答

相關問題