简单 bootstrap-select 不工作

Question

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <link rel="stylesheet" type="text/css" href="bootstrap-select.min.css">
</head>
<body>
    <select class="selectpicker">
        <option>Choose</option>
        <option>1</option>
        <option>1</option>
    </select>

    <script type="text/javascript" src="jquery-3.3.1.min.js"></script>
    <script type="text/javascript" src="bootstrap-select.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){
            $('.selectpicker').selectpicker();
        });
    </script>
</body>
</html>

我有这个代码。我正在使用 jquery 3.3.1 我使用了 https://github.com/silviomoreto/bootstrap-select 中的 bootstrap-select 并将其复制到我的本地以节省一些加载时间。但是当我尝试运行这个时，我得到了这个结果：

我做错了吗？我试过寻找答案，但似乎找不到任何有效的答案。谢谢。

注意：我尝试使用 Chrome 和 Firefox，两者都给了我相同的结果。

Answer 1

看来您需要包含 Bootstrap 的 dropdown.js 组件和 Bootstrap 的 CSS。只有这样你才能使用bootstrap-select。信息位于最顶部 http://silviomoreto.github.io/bootstrap-select/.

看看这个fiddlehttps://jsfiddle.net/sairam0903/x9bm7qs8/2/

Answer 2

this link 的依赖项部分有您的答案。

为此，您需要：

jQuery v1.8.0+
Bootstrap的dropdown.js
Bootstrap的CSS

如果您的项目中没有 bootstrap，您可以添加 minified version 并根据需要自定义它并重新编译它。

PS 不要使用 bootstrap 版本 4，因为它可能无法工作。

希望对您有所帮助！

Answer 3

尝试这个希望它有帮助 :)

$(document).ready(function(e) {
  $('.selectpicker').selectpicker();
});

<link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap-combined.min.css" rel="stylesheet">
<link rel="stylesheet" type="text/css" media="screen" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.9.3/css/bootstrap-select.min.css">


<select class="selectpicker" data-live-search="true">
  <option data-tokens="ketchup mustard">Hot Dog, Fries and a Soda</option>
  <option data-tokens="mustard">Burger, Shake and a Smile</option>
  <option data-tokens="frosting">Sugar, Spice and all things nice</option>
</select>



<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.9.3/js/bootstrap-select.min.js"></script>

简单 bootstrap-select 不工作

Simple bootstrap-select not working

html

javascript

css

jquery

bootstrap-select