用于多选的引导选择器 - 全选选项

Question

所以我需要的是多个引导选择器中的全选选项作为一个选项，所以我只需创建一个选择作为

<select class="form-control selectpicker" multiple>
   <option value="all">All</option>
   <option value="1">Dog</option>
   <option value="2">Cat</option>
   <option value="3">Tiger</option>
</select>

当我点击All 时，它会删除除全部以外的所有其他选项，如果我点击All 以外的任何选项，则需要删除所有选项

我尝试的是这样的

$(".selectpicker").change(function(event){
    if ($( this ).find("option:first").is(':selected')) {
        $( this ).find("option").prop('selected', false);
        $( this ).find("option:first").prop('selected', true);
    } else {
        $( this ).find("option:first").prop('selected', false);
    }
}); 

但是一旦点击了All，然后总是全部被激活并且什么都不能点击，我什至试图在onclick事件上获得价值，但由于引导选择选择器我可以得到它？

有什么技巧可以让这成为可能吗？我可以用一个选择器的静态变量来做到这一点，但不能用一个表单中的多个选择器来完成。

Answer 1

新编辑

这是一个有效的DEMO

$('.selectpicker').selectpicker();
var all = $('option[value=all]');
$('.selectpicker').change(function() {
var all = $('option[value=all]'); 
var thisVal = all.html();
if (all.is(':selected')) {
    $('.selectpicker').selectpicker('deselectAll');    
    $('ul.dropdown-menu > li[rel=0]').addClass('selected');
    $('span.filter-option').html(thisVal);
} else {
    $('ul.dropdown-menu > li[rel=0]').removeClass('selected');
}
});

Answer 2

我认为你可以做类似的事情

$("#multiple-select option").prop("selected", "selected");
$('#multiple-select').selectpicker('refresh');

必须使用道具。