Comment récupérer la valeur d'un formulaire select en jquery

Si vous avez un formulaire de type select en HTML et que vous souhaitez récupérer la valeur ou le texte du champ sélectionné, voici comment procéder.

Prenons exemple du formulaire suivant :

<select id="couleur">
	<option value="#FF0000">Rouge</option>
	<option value="#FFFF00">Jaune</option>
	<option value="#00FF00">Vert</option>
	<option value="#0000FF">Bleu</option>
</select>

Pour récupérer la valeur du champ actuellement sélectionné il vous faudra utiliser ce code jquery :

$('#couleur').val();

(Ce code retournera "#FFFF00" si vous avez sélectionné le champ Jaune dans le formulaire)

Tout simplement.

Par contre, pour récupérer le texte du champ actuellement sélectionné, votre code sera le suivant :

$('#couleur option:selected').text();

(Ce code retournera "Vert" si vous avez sélectionné le champ Vert dans le formulaire)

Il faudra donc ajouter l'option "option:selected" sans quoi le résultat retourné sera la liste des textes de tous les champs, de la forme "RougeJauneVertBleu". Vous pouvez très bien laisser cette option dans les deux cas de figure pour ne pas vous embêter à devoir vous rappeler dans quel cas il faut l'utiliser obligatoirement.