Comment savoir si une option d'un menu SELECT est sélectionnée en JavaScript ?

Réponses rédigées par Antoine

Dernière mise à jour : 2020-04-29 00:40:42

Question

J'ai un menu SELECT HTML du type suivant :

<select name="test" id="test">
    <option value="">--Sélectionnez une option--</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
</select>

Comment savoir par exemple si la troisième option du menu SELECT est sélectionnée, avec JavaScript ?

Réponse

Si tu sais dans quel ordre sont les options, et vu qu'elles sont traitées comme un tableau, tu peux procéder comme suit :

if (document.getElementById("test").options[2].selected == true)
{
alert('la troisième option est sélectionnée');
}

Si tu ne connais pas l'ordre, tu peux identifier le menu select, via son ID par exemple.

var select = document.getElementById("test");

Il suffit alors d'utiliser value pour récupérer la valeur sélectionnée.

var value = select.value;

Si tu veux récupérer le texte de l'option sélectionnée, tu doit utiliser l'élément selectedIndex.

var text = select.options[select.selectedIndex].text;