選擇選項釋放紅色

所以我有一個選擇元素與多個選項元素。除此之外的所有選項的元素有：選擇選項釋放紅色

color: black;

一個選項有：

color: red;

例如：

<select name="foo"> 
    <option value="1" class="textBlack">1</option> 
    <option value="2" class="textBlack">2</option> 
    <option value="3" class="textRed">3</option> 
    <option value="4" class="textBlack">4</option> 
</select>

問題是我想用紅色文字選擇留紅後被選中。因此，當HTML DOM中看起來是這樣的（即我點擊選擇元素，選擇紅色的選項）：

<select name="foo"> 
    <option value="1" class="textBlack">1</option> 
    <option value="2" class="textBlack">2</option> 
    <option value="3" class="textRed" selected="selected">3</option> 
    <option value="4" class="textBlack">4</option> 
</select>

我想在選擇元素中的文本是紅色的爲好。但是文字是黑色的。

來源

2011-02-25 Richard Knop

這'color'不是'文本color'。 – BoltClock 2011-02-25 14:17:48

@BoltClock我知道，這只是一個錯字。抱歉。 – 2011-02-25 14:20:42

與純CSS我不認爲這是可能的。您可以使用select {color:red}，但是這會使所有option變成紅色。爲了達到你所需要的可能需要的JavaScript，jQuery的代碼的例子如下：

$("select").change(function(){ 
    var current = $("select option:selected").attr("value"); 
    if (current == 3) {$("select").css('color','red');} else {$("select").css('color','black');} 
}); 
$("select").click(function() { 
    $("select option").css('color','black'); 
});

演示：http://jsfiddle.net/xrPKN/2/

來源

2011-02-25 14:56:22 Sotiris

-2

.textRed{color:red}

很簡單，除非我缺少什麼東西？

來源

2011-02-25 14:30:21 Alex

然後您必須通過JavaScript更改選擇的顏色。就像

$("select").change(function(){ 
    $(this).css("color", $(this).children("option:selected").css("color")); 
});

來源

2011-02-25 14:31:37 zdyn

選擇選項釋放紅色

回答

相關問題