Html выбрать вариант изменить цвет текст

Question

A есть таблица с именем Systems(id, name). Я посылаю запрос SELECT * FROM Systems WHERE id = SPECIFIC_ID. Тогда у меня есть еще один запрос SELECT * FROM Systems WHERE id != SPECIFIC_ID.

отобразить их все в HTML выбрать так:

<select id="select"> 
<option value="'.$row1["id"].'">'.$row1["name"].'</option> // this is the result of the first query 
while() { 
    //the result of the second query 
} 
</select> 

Теперь я хотел бы иметь первый вариант цветной красный. Теперь я пытался использовать JQuery код, который я нашел на stackoveflow:

$(document).ready(function() { 
    $('#select').css('color','gray'); 
    $('#select').change(function() { 
     var current = $('#select').val(); 
     if (current != 'null') { 
      $('#select').css('color','black'); 
     } else { 
      $('#select').css('color','gray'); 
     } 
    }); 
}); 

Это, как выше код работает: http://jsfiddle.net/fMQeq/

Но использовать его, вам нужно иметь определенное значение. В моем случае значение не является статическим. Как я могу покрасить этот параметр?

Answer 1

Невозможно установить на нем этот тег.

Но вы можете сделать альтернативный подход к этой цели:

Просто сделать выпадающий список div включая все option элементов и установить событие щелчка для него, после щелчка, измените значение <select> тега. Затем скройте тег <select>.

Answer 2

Вы можете попробовать это на примере?

<style> 
    .gray{ 
     background-color:#f00; 
     border:2px solid #f00; 
     color:#f00; 
    } 
    .black{ 
     background-color:#000; 
     border:2px solid #000; 
    } 
    </style> 

HTML

<select id="select"> 
    <option value="">--Select --</option> // this is the result of the first query 
    <option value="1">One</option> // this is the result of the first query 
    </select> 

SCRIPT

<script> 
    $(document).ready(function() { 
     $('#select').attr('color','gray'); 
     $('#select').change(function() { 
      var current = $('#select').val(); 
      if (current == "") { 
       $('#select').attr('class','black'); 
      } else { 
       $('#select').attr('class','gray'); 
      } 
     }); 
    }); 
    </script> 

Answer 3

Использование сырой CSS

select:nth-child(1){ 
    color:red; 
} 

И вам не нужно ставить ID там

Answer 4

Вы можете сделать это :) Невозможно поставить код css прямо в свой html.

<p><a href="http://www.korben.info/42" style="font-size:10px"><font color="red">YEAH</font></a>