Comment positionner un menu SELECT sur la première OPTION en JavaScript ?

Réponses rédigées par Antoine

Dernière mise à jour : 2021-02-01 12:05:34

Question

Bonjour, j'ai un menu HTML <select> dont l'option numéro 2 est sélectionnée :

<select id="exemple">
    <option value="">--Faites votre choix--</option>
    <option value="1">1</option>
    <option value="2" selected>2</option>
    <option value="3">3</option>
</select>

Comment puis-je positionner le menu sur la première option en JavaScript ?

Réponse

Pour modifier la sélection des OPTION d'un menu HTML <select> vous pouvez utiliser la paramètre JavaScript selectedIndex :

<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<title>Comment positionner un menu SELECT sur la première OPTION en JavaScript ?</title>
</head>  
<body>
<select id="exemple">
    <option value="">Faites votre choix</option>
    <option value="1">1</option>
    <option value="2" selected>2</option>
    <option value="3">3</option>
</select>
<script>
document.getElementById("exemple").selectedIndex = "0"; 
</script>
</body>
</html>

Remarque : la valeur 0 de selectedIndex correspond à la première option, 1 à la seconde, etc. La valeur -1 permet de désélectionner toutes les options.