从multiselect中的选定选项获取属性值

getting attribute values from selected options in multiselect

本文关键字:选项 获取 属性 multiselect      更新时间:2023-09-26

我在jQuery中有一个多选元素。

下面是一个例子。

<select multiple id="multiple">
    <option value="1" type="Alice">Option 1</option>
    <option value="2" type="Bob">Option 2</option>
</select>

我知道我可以通过做$("#multiple").val(); 获得所有选择的值

如何获取所选选项的类型属性?

您需要使用伪option:selected并查看所选的每个选项:

$('#multiple').change(function(){
    var $value =$('option:selected',this).attr('type');
    console.log($value);
});

或者使用类似.each()

$('#multiple option:selected').each(function(){
    var $value =$(this).attr('type');
    console.log($value);
});

演示

带.each((的演示

试试这个:

$(document).on("change", "#multiple", function(){
    var ids = $(this).find('option:selected').map(function() {
        return $(this).attr('type');    
    }).get();
    console.log(ids);
});

JSFiddle:

http://jsfiddle.net/LFMG7/2/

可能最简单的方法是使用.map():

var types = $('#multiple > option:selected').map(function() {
    return this.getAttribute('type');
}).get();

演示

var t = document.getElementById('multiple'), a = [], i;
for(i = 0; i < t.length; i++) {
    if(t[i].selected) a.push(t[i].getAttribute('type'));
}
// tested on IE8+, Chrome (Windows & Linux), Safari, Firefox (Windows & Linux), Opera 

Fiddle

也许是这样的:

var myList = array();
$('#multiple option:selected').each(function(){
    myList.push({"val":$(this).val(), "type":$(this).attr("type")});
});