HTML選択要素の選択したオプションの色を設定します

Question

私のHTMLには、<select>には多くの<option>要素があります。 Javascript変数に対して各オプションの値を確認するためにjQueryを使用したいと思います。一致するものがあれば、そのオプションの色を設定したい。どうすればいい？

Answer 1

私はあなたの条件から理解する場合は、次のことを試してみてください、

var yourVar = 1; //consider your expected value; 
$(document).on('change', '#selectId', function(){ 

    var currentValue = $(this).val(); 
    if(yourVar == currentValue) 
    { 
     //apply your colour logic 
    } 
}); 

Answer 2

それは単なるHTMLのリストではなく、jQueryのUIの一つだ場合、それがすべてです：

var found = $('#cars option[value="saab"]');//Search for 'saab' value 
 
found.css("color","red");//Set color as red

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<select id="cars"> 
 
    <option value="volvo">Volvo</option> 
 
    <option value="saab">Saab</option> 
 
    <option value="mercedes">Mercedes</option> 
 
    <option value="audi">Audi</option> 
 
</select>

Answer 3

あなたはjqueryから選択したオプションを、$(select).find('option:selected')からキャッチできます。別の方法はです210（これはselectの値を返します）。

しかし、select要素が不可能なスタイルにする、チェックアウトこのlink