J'utilise des espaces réservés pour les entrées de texte, ce qui fonctionne très bien. Mais j’aimerais également utiliser un caractère de remplacement pour mes boîtes de sélection. Bien sûr, je peux simplement utiliser ce code :
<select>
<option value="">Select your option</option>
<option value="hurr">Durr</option>
</select>
Mais la case "Select your option" est en noir au lieu d'être en gris clair. Ma solution pourrait donc être basée sur le CSS, mais jQuery convient aussi.
Cela ne fait que rendre l'option grise dans la liste déroulante (donc après avoir cliqué sur la flèche) :
option:first {
color: #999;
}
La question est la suivante : comment fait-on pour créer des espaces réservés dans les boîtes de sélection ? Mais il y a déjà été répondu, merci.
Et en utilisant cela, la valeur sélectionnée est toujours grise (même après avoir sélectionné une vraie option) :
select {
color: #999;
}
Je viens de tomber sur cette question, et voici ce qui fonctionne dans Firefox et Chrome (au moins) :
Quelque chose comme ça :
HTML :
<select id="choice">
<option value="0" selected="selected">Choose...</option>
<option value="1">Something</option>
<option value="2">Something else</option>
<option value="3">Another choice</option>
</select>
CSS :
#choice option { color: black; }
.empty { color: gray; }
JavaScript :
$("#choice").change(function () {
if($(this).val() == "0") $(this).addClass("empty");
else $(this).removeClass("empty")
});
$("#choice").change();
Exemple de travail :