<select id="selectID1">
<option value="1">Un</option>
<option value="2" selected>Deux</option>
<option value="3">Trois</option>
</select>
Chaque élément sélectionné possède deux paramètres :
-
La valeur :
console.log( "valeur = ", $( "#selectID1" ).val() );
. -
Le texte :
console.log( "texte = ", $( "option:selected", "#selectID1" ).text() );
.
Nota bene : en absence de l'attribut "value" dans le tag "option",
$( "#selectID1" ).val()
retourne le texte contenu dans l'option.
Exemple, lorsque plusieurs options peuvent être sélectionnées :
<select id="selectID2" multiple>
<option value="1">Un</option>
<option value="2" selected>Deux</option>
<option value="3">Trois</option>
</select>
$( "#selectID2" ).on( "change", function(){
var tabVal = $( this ).val(),
monArray = [],
str = "";
$( "option:selected", this ).each( function( i, item ){
str = $( item ).val() + " = " + $( item ).text();
monArray.push( str );
});
// array des valeurs des options sélectionnées
console.log( "valeurs = ", tabVal );
// array des valeurs et des textes des options sélectionnées
console.log( "valeurs et textes :\n", monArray.join( "\n" ) );
});