jquery - 如何获取引导选择器中单击的选项？

Question

$('.excludeDaysPicker').selectpicker();

我的引导选择器启用了“多个”选择选项。

<select class="excludeDaysPicker" multiple title="Not Selected">
<option value="Monday" id="1" class="excludeDays">Monday</option>
<option value="Tuesday" id="2" class="excludeDays">Tuesday</option>
<option value="Wednesday" id="3" class="excludeDays">Wednesday</option>
<option value="Thursday" id="4" class="excludeDays">Thursday</option>
<option value="Friday" id="5" class="excludeDays">Friday</option>
<option value="Saturday" id="6" class="excludeDays">Saturday</option>
<option value="Sunday" id="7" class="excludeDays">Sunday</option>
</select>

单击选择选项(选择或取消选择)后，我想知道单击了哪个选项。

我已经尝试过了。

$('.excludeDaysPicker').on('change',function(){
console.log("id::",$(this).children(':selected').attr('id'));
});

这实际上确实得到了我的 ID。但由于它是一个启用多重选择的选择器。如果已经选择了一个选项。返回该选项的 id。例如，在下面的屏幕截图中

如果我点击星期三，它会给我id 2(因为选择了星期二)，但实际上星期三的id是3。我想要我点击的选项元素的id。

而且我也无法通过给选项元素一个 class 来获取选项元素，因为引导选择器插件为所有选项元素创建了一个列表，如下所示。

所以，

 $('.excludeDays').click(function()
 {
  console.log("excluded day optionselected::",$(this).attr('id'));  
 });

也没有帮助。

各位有办法吗？

Answer 1

获取所选选项各自的 ID:

$('.excludeDaysPicker').on('change',function(){
    $(this).find("option:selected").each(function()
    {
        alert($(this).attr("id"));
    });
});

更新:要获取最后一个选定的值，请将所有选定的值推送到数组中并获取最后一个元素的 id。

    var arr = new Array();
$('.selectpicker').on('change', function(){
     $(this).find("option").each(function()
     {
         if($(this).is(":selected"))
         {             
            id = $(this).attr("id");
            if(arr.indexOf(id) == -1)
            {
               arr.push(id);
            }
         }
         else
         {
             id = $(this).attr("id");
             arr = jQuery.grep(arr, function(value) {
              return value != id;
            });             
         }
     });

if(arr.length > 0)
    alert("Last selected id : " + arr[arr.length-1]);

  });

http://jsfiddle.net/wd1z0zmg/3/