web-dev-qa-db-fra.com

Comment obtenir plusieurs valeurs de sélection à l'aide de jQuery?

Comment obtenir plusieurs valeurs de sélection à l'aide de jQuery?

146
DEVOPS

jQuery .val ()

  var foo = $('#multiple').val(); 
163
Pranay Rana

L'utilisation de la fonction .val() dans une liste à sélection multiple renvoie un tableau des valeurs sélectionnées:

var selectedValues = $('#multipleSelect').val();

et dans votre html:

<select id="multipleSelect" multiple="multiple">
    <option value="1">Text 1</option>
    <option value="2">Text 2</option>
    <option value="3">Text 3</option>
</select>
281
Darin Dimitrov

Vous pouvez également utiliser la fonction js map:

$("#multipleSelect :selected").map(function(i, el) {
    return $(el).val();
}).get();

Et puis vous pouvez obtenir n'importe quelle propriété de l'élément option:

return $(el).text();
return $(el).data("mydata");
return $(el).prop("disabled");
etc...
12
kpull1
var selected=[];
 $('#multipleSelect :selected').each(function(){
     selected[$(this).val()]=$(this).text();
    });
console.log(selected);

Encore une autre approche à ce problème. Le tableau sélectionné aura les index comme valeurs d'option et chaque élément du tableau aura le texte comme valeur.

par exemple

<select id="multipleSelect" multiple="multiple">
    <option value="abc">Text 1</option>
    <option value="def">Text 2</option>
    <option value="ghi">Text 3</option>
</select>

si par exemple les options 1 et 2 sont sélectionnées.

le tableau sélectionné sera:

selected['abc']=1; 
selected['def']=2.
9
Joz Naveen Joz

Code HTML:

 <select id="multiple" multiple="multiple" name="multiple">
  <option value=""> -- Select -- </option>
  <option value="1">Opt1</option>
  <option value="2">Opt2</option>
  <option value="3">Opt3</option>
  <option value="4">Opt4</option>
  <option value="5">Opt5</option>
 </select>   

Code JQuery:

$('#multiple :selected').each(function(i, sel){ 
    alert( $(sel).val() ); 

});

Esperons que ça marche

4
Prabhagaran

Juste par une ligne

var select_button_text = $('#SelectQButton option:selected')
                .toArray().map(item => item.text);

Sortie: ["text1", "text2"]

var select_button_text = $('#SelectQButton option:selected')
                .toArray().map(item => item.value);

Sortie: ["valeur1", "valeur2"]

Si vous utilisez .join ()

var select_button_text = $('#SelectQButton option:selected')
                .toArray().map(item => item.text).join();

Sortie: texte1, texte2, texte3

1
hardika

Obtenir les valeurs sélectionnées dans le séparateur de virgule

var Accessids = "";
$(".multi_select .btn-group>ul>li input:checked").each(function(i,obj)
{
    Accessids=Accessids+$(obj).val()+",";
});
Accessids = Accessids.substring(0,Accessids.length - 1);
console.log(Accessids);
0
Santhosh Rajkumar

Il suffit d'utiliser cette

$('#multipleSelect').change(function() {
    var selectedValues = $(this).val();  
});
0
Kartik Chauhan