无法更改 Bootstrap-select 选择器的标题答案

【问题标题】：Cannot change title of Boostrap-select selectpicker无法更改 Bootstrap-select 选择器的标题
【发布时间】：2017-01-08 10:59:40
【问题描述】：

我想以编程方式更改我的 Bootstrap-select 选择器的标题。

我尝试了以下 JS 代码，但不起作用。

$('#myPicker')
    .selectpicker({title: 'New title'})
    .selectpicker('render');

还有其他方法可以做到这一点吗？

【问题讨论】：

标签： html twitter-bootstrap bootstrap-select bootstrap-selectpicker

【解决方案1】：

仅当 DOM 已更新时，Selectpicker 才会更新。下面的函数应该更新标题，因为它允许 selectpicker 附加一个新的 html 对象（DOM 已更改）

function newTitle() {
    var selectpicker = $("#myPicker");
    selectpicker.selectpicker();
    selectpicker.selectpicker({title: 'New Title'}).selectpicker('render');
    html = '';
    selectpicker.html(html);
    selectpicker.selectpicker("refresh");
}

【讨论】：

【解决方案2】：

发布的代码似乎在 sn-p 中有效。

$(document).ready(function() {
  $('#myPicker2')
    .selectpicker({
      title: 'New title'
    });
});

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.11.0/css/bootstrap-select.min.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.11.0/js/bootstrap-select.min.js"></script>

<select id="myPicker1" class="selectpicker" multiple title="Choose one of the following...">
  <option>Mustard</option>
  <option>Ketchup</option>
  <option>Relish</option>
</select>

<select id="myPicker2" class="selectpicker" multiple title="Choose one of the following...">
  <option>Mustard</option>
  <option>Ketchup</option>
  <option>Relish</option>
</select>

【讨论】：