javascript - ドロップダウンリストの最初の要素のスタイリング

Question

jquery/javascriptでドロップダウンの最初の要素の色を設定したいです。

ドロップダウンの最初の要素が選択されているかどうかを特定の色にする必要があることを意味します。

例えば：

ドロップダウン リストに 4 つの要素があるとします:-

select
Car
Bike
Bus

次に、最初の要素（選択）は常に特定の色で表示されます。

編集 ：

上の画像によると、選択フィールドはリスト上で色付けされていますが、デフォルトのテキストではありません。

両方欲しい。

Answer 1

$("#selectboxid option:eq(0)").css("color","red");// you can set any color

cssとeqを参照

Answer 2

これを試して

HTML:

<select id="selectboxid">
<option selected="selected">Hello</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
</select>

J:

$("#selectboxid").css("color","green");
$("#selectboxid option").not("#selectboxid :selected").each(function(){
$(this).css("color","black")
});
$("#selectboxid").change(function(){
    $("option",this).each(function(){
    $(this).css("color","black");
    })
    $(":selected",this).css("color","green");
})

フィドル

Answer 3

selectCSS を使用すると、オプションのスタイルを設定できます (一部のブラウザーでは、要素を確実にスタイル設定することが難しいため、必ずしもすべてではありません) select(次の HTML が与えられます)。

<select>
    <option>Select</option>
    <option value="1">One</option>
    <option value="2">Three</option>
    <option value="3">Two</option>
</select>

そしてCSS：

option {
    color: #f00;
}

option[value] {
    color: #000;
}

JS フィドルのデモ。

上記のアプローチでは、もちろん、属性セレクター表記を理解し、 color を持つ属性を持つoption要素と属性を持たない要素のスタイルを設定するブラウザーを使用する必要があります。value#000optionvalue#f00

Answer 4

それはあなたが望むものですか？(cssあり)

select option:first-child{
    background:red;
}

ここにフィドルがあります：

http://jsfiddle.net/PjjmT/

Answer 5

試してみてくださいthis。これは役に立ちます

HTML

<select><option>ABC</option><option>CDE</option><option>FGH</option></select>

JS

$('select option:first-child').css("background-color", 'red');