如何获得bootstrap selectpicker中的点击选项？

Question

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

我有bootstrap 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。但是因为它是一个多重选择启用selectpicker。如果已经选择了一个选项。该选项的ID将被返回。为前，在下面的屏幕截图

如果我点击周三，它给我的ID 2（因为周二被选中），但实际上，周三的id为3。我想的ID我点击的选项元素。

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

所以，

$('.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")); 
    }); 
}); 

UPDATE：要获得最后选定的价值，推动阵列中的所有选择的值，并获得最后一个元素的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/