Jawaban:
var foo = $('#multiple').val();
Menggunakan .val()
fungsi pada daftar multi-pilih akan mengembalikan array dari nilai yang dipilih:
var selectedValues = $('#multipleSelect').val();
dan di html Anda:
<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
daripada array kosong. Ini berarti jika Anda secara sistematis menambahkan nilai yang dipilih, Anda memiliki sedikit juggling yang harus dilakukan untuk memperbaikinya.
var selectedValues = $('#multipleSelect').val() || [];
Juga patut dicatat mengembalikan array string. Saya membandingkan bilangan bulat dan tidak mendapatkan kecocokan, jadi saya menambahkan .toString()
.
Anda juga dapat menggunakan fungsi peta js:
$("#multipleSelect :selected").map(function(i, el) {
return $(el).val();
}).get();
Dan kemudian Anda bisa mendapatkan properti apa pun dari option
elemen:
return $(el).text();
return $(el).data("mydata");
return $(el).prop("disabled");
etc...
el
sebagai objek jQuery untuk setiap opsi. Langsung saja keluar dari DOM ketika itu tidak terlalu aneh. Anda bisa berubah $(el).val()
menjadi adil el.value
. Tentu saja jika Anda terbiasa dengan jQuery atau ingin mengambil data atau atribut seperti contoh lainnya, jQuery tidak menyakiti siapa pun.
var selected=[];
$('#multipleSelect :selected').each(function(){
selected[$(this).val()]=$(this).text();
});
console.log(selected);
Namun pendekatan lain untuk masalah ini. Array yang dipilih akan memiliki indeks sebagai nilai opsi dan setiap item array akan memiliki teks sebagai nilainya.
sebagai contoh
<select id="multipleSelect" multiple="multiple">
<option value="abc">Text 1</option>
<option value="def">Text 2</option>
<option value="ghi">Text 3</option>
</select>
jika katakan opsi 1 dan 2 dipilih.
array yang dipilih adalah:
selected['abc']=1;
selected['def']=2.
Hanya dengan satu baris-
var select_button_text = $('#SelectQButton option:selected')
.toArray().map(item => item.text);
Output: ["text1", "text2"]
var select_button_text = $('#SelectQButton option:selected')
.toArray().map(item => item.value);
Output: ["value1", "value2"]
Jika Anda menggunakan .join ()
var select_button_text = $('#SelectQButton option:selected')
.toArray().map(item => item.text).join();
Output: text1, text2, text3
Kode 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>
Kode JQuery:
$('#multiple :selected').each(function(i, sel){
alert( $(sel).val() );
});
Semoga berhasil
$('#multiple').find(':selected')
be pengantar dengan pemilih ID seperti ini: @Prabhagaran
Dapatkan nilai yang dipilih di pemisah koma
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);
Gunakan ini saja
$('#multipleSelect').change(function() {
var selectedValues = $(this).val();
});
Text 1
alih-alih nilai? ganti.val()
dengan.text()
?