如何使用 jQuery 获取多个选择框值?

如何使用 jQuery 获取多个选择框值?

484554 次浏览

在多选列表中使用 .val()函数将返回选定值的数组:

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

以及你的 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>

Val ()

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

你也可以使用 js map 函数:

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

然后你可以得到 option元素的任何属性:

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

这是解决这个问题的另一种方法。所选数组将索引作为选项值,每个数组项将文本作为其值。

比如说

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

如果选择了选项1和选项2。

选择的数组将是:

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

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 代码:

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


});

希望有用

获取逗号分隔符中的选定值

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

用这个

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

只差一行

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

输出: [“ text1”,“ text2”]

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

输出: [“ value1”,“ value2”]

如果使用. join ()

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

输出: text1,text2,text3

如果你在一个页面上有多个选择框,并且它们都有相同的类,你可以选择多个而不是跟踪 id:

$('.classname option:selected').map(function(){
return this.value; // If you want value.
// Or you could also do.
return this.text; // If you want text of select boxes.
}).get(); // It will return an Array of selected values/texts.