bootstrap selectpicker 和 bootstrap.js 文件之间的冲突答案

【问题标题】：Conflicting between bootstrap selectpicker and bootstrap.js filebootstrap selectpicker 和 bootstrap.js 文件之间的冲突
【发布时间】：2015-05-27 05:01:14
【问题描述】：

我发现 bootstrap selectpicker 不适用于 bootstrap.js 文件。如果 bootstrap.js 和 selectpicker 文件在同一个位置，listpicker 不会打开。

<select class="form-control deptId selectpicker" name="depId" placeholder="Department Name">
    <option selected="selected">Select department name</option>
    <option>Depart 1</option>
    <option>Depart 2</option>
    <option>Depart 3</option>
    <option>Depart 4</option>
    <option>Depart 5</option>
</select>

Fiddle Sample

https://jsfiddle.net/uscj19zL/3/

【问题讨论】：

Grtz，你为什么不接受？

标签： jquery twitter-bootstrap debugging twitter-bootstrap-3 bootstrap-select

【解决方案1】：

您当前正在按以下顺序加载以下 JavaScript 文件：

jQuery 2.1.0
引导程序 3.2.0
引导选择 1.6.5
引导程序 3.3.4

第二次调用不同版本的引导程序是导致问题的原因。摆脱它，你应该会没事的。

堆栈片段中的演示

$('.selectpicker').selectpicker({
    style: 'btn-default',
    size: 4
});

<link href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.2/css/bootstrap.css" rel="stylesheet"/>
<link href="//cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.7.1/css/bootstrap-select.css" rel="stylesheet"/>

<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.2/js/bootstrap.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.7.1/js/bootstrap-select.js"></script>

<select class="form-control deptId selectpicker" name="depId" placeholder="Department Name">
  <option selected="selected">Select department name</option>
  <option>Depart 1</option>
  <option>Depart 2</option>
  <option>Depart 3</option>
  <option>Depart 4</option>
  <option>Depart 5</option>
</select>

另外，这是一个updated Demo in Fiddle

【讨论】：