Définissez l'option sélectionnée via CSS?

Est-il possible de définir la selected attribut d'un option tag via une classe CSS?

Je me demandais si quelque chose comme cela est possible dans une feuille de style:

option.selected {
  selected: true;
}

Puis en HTML:

<option class="selected">

Qui aurait le même effet que la définition de l' selected attribut. Est-ce une technique possible?

InformationsquelleAutor Travis Beale | 2009-07-13
  1. 11

    Nope, le CSS ne s'applique qu'à la présentation, pas le contenu (même si CSS3 prend en charge la modification de contenu, mais pas la sélection de valeurs). Vous aurez besoin d'utiliser le JavaScript si vous ne pouvez pas modifier le code HTML directement.

    • C'est ce que je m'en doutais, merci pour la confirmation.
    InformationsquelleAutor Blixt
  2. 2

    Pas via le CSS, mais il peut être accompli via javascript. 

    function setSelects() {

    var allSelects = document.getElementsByTagName("select");
    for (var i = 0; i < allSelects.length; i++) {
        for (var j = 0; j < allSelects[i].options.length; j++) {
            if (allSelects[i].options[j].className == "selected") {

                allSelects[i].selectedIndex = j;
            }
        }
    }
}

window.onload = setSelects;

    Que d'autres personnes l'ont souligné, je ne suis pas sûr pourquoi vous voulez le faire par l'intermédiaire d'une classe CSS en premier lieu.

    InformationsquelleAutor Matt Bridges
  3. 2
    option[selected] {background-color:skyblue;color:white;}

    dans le cas où vous souhaitez afficher le précédent marqué sélection - independend des changements de l'utilisateur après l'affichage d'un résultat, l'ancien sélectionnés resteront sykblue, les nouveaux changements sont en bleu fonce.

    InformationsquelleAutor Steelpandrummer
  4. 1

    Si vous utilisez JQuery, alors vous pouvez faire quelque chose le long de ces lignes, mais pas CSS sur son propre.

    InformationsquelleAutor NikolaiDante
  5. 0

    Sélectionné n'est pas une propriété CSS. Voir la spec http://www.w3.org/TR/CSS2/propidx.html.

    InformationsquelleAutor tvanfosson
  6. 0

    Oui c'est possible, mais je ne suis pas sûr que IE

    Code ci-dessous va changer de style pour par défaut est sélectionné élément.

               <style>
           option[selected="selected"] {
           color:red;
           font-weight:bold
           }
           </style>

           <select>
           <option value="1">Txt</option>
           <option value="2" selected="selected">Another Txt</option>
           </select>
    InformationsquelleAutor Nadeer Madampat Tanalur