bootstrap-select核心方法method

方法
bootstrap-select插件接口。

.selectpicker(‘val’)
你可以通过调用元素上的val方法来设置选定的值。

$('.selectpicker').selectpicker('val', 'Mustard');
$('.selectpicker').selectpicker('val', ['Mustard','Relish']);

这跟直接调用select元素的val方法还有点不同，如果你直接调用元素上的val()方法，bootstrap-select前端ui将不会重新刷新（作为更改事件只从交互引发）。你将不得不调用前端的ui刷新。

$('.selectpicker').val('Mustard');
$('.selectpicker').selectpicker('render');

// this is the equivalent of the above
$('.selectpicker').selectpicker('val', 'Mustard');

.selectpicker(‘selectAll’)
这将会把multi-select多选中的选项全部选中。

$('.selectpicker').selectpicker('selectAll');

.selectpicker(‘deselectAll’)
这将会取消multi-select多选中的所有选中列表。

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

.selectpicker(‘render’)
你可以强制渲染bootstrap-select前端UI通过render方法，如果你通过编程的方式来改变选项的值，这个方法是很有用的。

$('.selectpicker').selectpicker('render');

.selectpicker(‘mobile’)
通过调用移动滚动方法$(‘.selectpicker’).selectpicker(‘mobile’)。这是设备的本地菜单用于选择列表。
检测浏览器的方法由用户自行决定。

if( /Android|webOS|iPhone|iPad|iPod|BlackBerry/i.test(navigator.userAgent) ) {
  $('.selectpicker').selectpicker('mobile');
}

.selectpicker(‘setStyle’)
修改与按钮本身相关或者它的容器的class(es)。
如果在它的container上改变class:

$('.selectpicker').addClass('col-lg-12').selectpicker('setStyle');

如果改变按钮上的class(es)(改变data-style)。

// Replace Class
$('.selectpicker').selectpicker('setStyle', 'btn-danger');

// Add Class
$('.selectpicker').selectpicker('setStyle', 'btn-large', 'add');

// Remove Class
$('.selectpicker').selectpicker('setStyle', 'btn-large', 'remove');

.selectpicker(‘refresh’)
以编程的方式用JavaScript改变select，首先操纵选项，然后使用refresh 方法来更新UI来适应新的状态，当添加或者删除属性的时候这是必须的，或者通过JavaScript脚本关闭或启动的时候。

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

<select class="selectpicker remove-example">
  <option value="Mustard">Mustardoption>
  <option value="Ketchup">Ketchupoption>
  <option value="Relish">Relishoption>
select>

<button class="btn btn-warning rm-mustard">Remove Mustardbutton>
<button class="btn btn-danger rm-ketchup">Remove Ketchupbutton>
<button class="btn btn-success rm-relish">Remove Relishbutton>

$('.rm-mustard').click(function () {
  $('.remove-example').find('[value=Mustard]').remove();
  $('.remove-example').selectpicker('refresh');
});

$('.ex-disable').click(function () {
  $('.disable-example').prop('disabled', true);
  $('.disable-example').selectpicker('refresh');
});

$('.ex-enable').click(function () {
  $('.disable-example').prop('disabled', false);
  $('.disable-example').selectpicker('refresh');
});

.selectpicker(‘toggle’)
以编程的方式触发bootstrap-select菜单打开或关闭。

.selectpicker(‘hide’)
以编程的方式使用hide方法隐藏bootstrap-select的选项（这只会影响bootstrap-select自身的可见性）。

$('.selectpicker').selectpicker('hide');

.selectpicker(‘show’)
以编程的方式使用show方法展示bootstrap-select（这只会影响bootstrap-select自身的可见性）。

.selectpicker(‘destroy’)
以编程的方式销毁bootstrap-select，使用destroy方法。

$('.selectpicker').selectpicker('destroy');