如何在按钮单击后重置 Bootstrap-select 的值

Question

我正在使用 Bootstrap-select 插件 (https://silviomoreto.github.io/bootstrap-select/) 作为我的下拉选择框。单击按钮后，我希望刷新该框并重置“选定”选项。这是下拉菜单

<select id="dataPicker" class="selectpicker form-control">
  <option value="default" selected="selected">Default</option>
  <option value="one">One</option>
  <option value="two">Two</option>
  <option value="three">Three</option>
</select>

这是我的尝试，但行不通。有什么想法应该如何吗？

$("#dataPicker option:selected").val('default');
$("#dataPicker").selectpicker("refresh");

Answer 1

没有“选项：已选择”

$("#dataPicker").val('default');
$("#dataPicker").selectpicker("refresh");

Answer 2

您可以将其写在一行中，从而减少额外的代码。

$("#dataPicker").val('default').selectpicker("refresh");

Answer 3

您可以通过向 select-element 添加 autocomplete 属性并将其设置为 “off” 来轻松解决此问题。

<select id="dataPicker" class="selectpicker form-control" autocomplete="off">
  <option value="default" selected="selected">Default</option>
  <option value="one">One</option>
  <option value="two">Two</option>
  <option value="three">Three</option>
</select>

Answer 4

Bootstrap Select 5 使用

$('.selectpicker').selectpicker('deselectAll')

Answer 5

如果您不知道初始值，可以使用：

$('#dataPicker option').prop('selected', function() {
    return this.defaultSelected;
});

$('#dataPicker').selectpicker('refresh');