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事件的价值但是由于bootstrap selectpicker我能够得到它吗？

任何使这成为可能的技巧？我可以使用静态变量为一个选择器执行此操作，但无法在表单中使用多个selectpicker完成此操作。

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

必须使用道具。

用于多选的Bootstrap选择器 - 选择所有选项

2 个答案: