Comment obtenir de multiples sélectionnez les valeurs d'une zone à l'aide de jquery?

pourriez poster du code de choses que vous avez essayé cela ne fonctionne pas

InformationsquelleAutor DEVOPS | 2010-07-14

160

jQuery .val()
```
  var foo = $('#multiple').val(); 
```
InformationsquelleAutor Pranay Rana
279

À l'aide de la .val() fonction sur une liste à choix multiples retournera un tableau de valeurs sélectionnées:
```
var selectedValues = $('#multipleSelect').val();
```
et dans votre code 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>
```
- si tu veux obtenir Text 1 au lieu de la valeur? remplacer .val() avec .text()?
- Intéressant de noter qu'un select multiple, si rien n'est sélectionné retourne null plutôt qu'un tableau vide. Cela signifie que si vous êtes en programmant ajout une valeur sélectionnée, vous avez un peu de jonglage pour obtenir ce droit.
- Merci!!!! Il existe de nombreuses façons de récupérer la valeur d'un élément avec jQuery que c'est inévitablement une lutte pour trouver le chemin que vous cherchez.
- Si vous souhaitez obtenir l'Id jsfiddle.net/kingleroyg/kwrhoLrh
- vous pouvez ajouter un coalesc pour contourner le problème de null e.g var selectedValues = $('#multipleSelect').val() || []; Également intéressant de noter, elle retourne un tableau de chaînes de caractères. J'ai été comparant à un nombre entier et pas les matchs, donc j'ai ajouté un .toString().
InformationsquelleAutor Darin Dimitrov
11

Vous pouvez également utiliser js carte fonction:
```
$("#multipleSelect :selected").map(function(i, el) {
    return $(el).val();
}).get();
```
Et alors vous pouvez obtenir tout bien de la option élément:
```
return $(el).text();
return $(el).data("mydata");
return $(el).prop("disabled");
etc...
```
- grande réponse, mais pas besoin de payer les frais supplémentaires d'emballage el comme un objet jQuery pour chaque option. Allez tout droit hors DOM quand il n'est pas trop bizarre. Vous pouvez changer $(el).val() juste el.value. Bien sûr, si vous avez l'habitude de jQuery ou souhaitez saisir des données ou des attributs comme la votre d'autres exemples, jQuery n'est pas le blesser.
- Bon conseil. Juste utilisé cette approche pour extraire une collection de champ caché valeurs et cela a fonctionné parfaitement.
InformationsquelleAutor kpull1

var selected=[];
 $('#multipleSelect :selected').each(function(){
     selected[$(this).val()]=$(this).text();
    });
console.log(selected);

Encore une autre approche de ce problème. Le tableau sélectionné aura l'index comme étant les valeurs d'option et chaque élément de tableau contiendra le texte de sa 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>

dire si les options 1 et 2 sont sélectionnés.

le tableau sélectionné sera :

selected['abc']=1; 
selected['def']=2.

InformationsquelleAutor Joz Naveen Joz

4

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>   
```
JQuery Code:
```
$('#multiple :selected').each(function(i, sel){ 
    alert( $(sel).val() ); 

});
```
Espérons que cela fonctionne
- Ne pas "j'espère que ça fonctionne", si vous n'êtes pas sûr si c'est la réponse, la tester et être sûr!
- Si vous n'êtes pas sûr de la réponse , alors ne postez pas..!! nous ne sommes pas ici pour l'espoir ..!! LOL
- Hey Man. Il fonctionne parfaitement. Check it out. Vous devriez espère que c'. Ne donnez pas de commentaire sans importance..
- C'est une mauvaise utilisation de jQuery. Une meilleure approche est de préface à un sélecteur d'ID comme ceci: $('#multiple').find(':selected') @Prabhagaran
- J'ai à peine le dire, il est "inefficace", comme la différence de temps est la relativité rien...
InformationsquelleAutor Prabhagaran

Être sélectionné, les valeurs en virgule de séparation

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);

InformationsquelleAutor Santhosh Rajkumar

Il suffit d'utiliser cette

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

InformationsquelleAutor Kartik Chauhan

Seulement par une seule ligne-

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

De sortie: ["texte1", "texte2"]

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

De sortie: ["valeur1", "valeur2"]

Si vous utilisez .join()

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

De sortie: text1,text2,text3

InformationsquelleAutor hardika

Vous devez vous connecter pour publier un commentaire.