Odpowiedzi:
var foo = $('#multiple').val();
Użycie .val()
funkcji na liście wielokrotnego wyboru zwróci tablicę wybranych wartości:
var selectedValues = $('#multipleSelect').val();
aw Twoim 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>
null
zamiast pustej tablicy. Oznacza to, że jeśli programowo dodajesz wybraną wartość, musisz trochę żonglować, aby zrobić to dobrze.
var selectedValues = $('#multipleSelect').val() || [];
Warto również zauważyć, że zwraca tablicę ciągów. Porównywałem do liczby całkowitej i nie otrzymałem żadnych dopasowań, więc dodałem .toString()
.
Możesz także użyć funkcji js map:
$("#multipleSelect :selected").map(function(i, el) {
return $(el).val();
}).get();
A następnie możesz uzyskać dowolną właściwość option
elementu:
return $(el).text();
return $(el).data("mydata");
return $(el).prop("disabled");
etc...
el
jako obiektu jQuery dla każdej opcji. Po prostu wyjdź od razu z DOM, jeśli nie jest to zbyt dziwne. Możesz zmienić się $(el).val()
na po prostu el.value
. Oczywiście, jeśli jesteś przyzwyczajony do jQuery lub chcesz pobrać dane lub atrybuty, tak jak w innych przykładach, jQuery nikomu nie szkodzi.
var selected=[];
$('#multipleSelect :selected').each(function(){
selected[$(this).val()]=$(this).text();
});
console.log(selected);
Jeszcze inne podejście do tego problemu. Wybrana tablica będzie miała indeksy jako wartości opcji, a każdy element tablicy będzie miał tekst jako wartość.
na przykład
<select id="multipleSelect" multiple="multiple">
<option value="abc">Text 1</option>
<option value="def">Text 2</option>
<option value="ghi">Text 3</option>
</select>
jeśli powiedzmy, że wybrano opcję 1 i 2.
wybrana tablica będzie:
selected['abc']=1;
selected['def']=2.
Tylko o jedną linię
var select_button_text = $('#SelectQButton option:selected')
.toArray().map(item => item.text);
Wynik: ["tekst1", "tekst2"]
var select_button_text = $('#SelectQButton option:selected')
.toArray().map(item => item.value);
Wynik: ["wartość1", "wartość2"]
Jeśli używasz .join ()
var select_button_text = $('#SelectQButton option:selected')
.toArray().map(item => item.text).join();
Wyjście: tekst1, tekst2, tekst3
Kod 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>
Kod JQuery:
$('#multiple :selected').each(function(i, sel){
alert( $(sel).val() );
});
Mam nadzieję, że to działa
$('#multiple').find(':selected')
@Prabhagaran
Pobierz wybrane wartości z separatorem przecinkiem
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);
Po prostu użyj tego
$('#multipleSelect').change(function() {
var selectedValues = $(this).val();
});
Text 1
zamiast wartości? wymienić.val()
z.text()
?