javascript 简单引导选择不起作用

kxe2p93d 于 2023-01-16 发布在 Java

关注(0)|答案(4)|浏览(133)

<!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，我使用bootstrap-select from https://github.com/silviomoreto/bootstrap-select，并将其复制到本地以保存加载时间，但当我尝试运行这段代码时，我得到了以下结果：

我做错了吗？我试着搜索答案，但似乎找不到任何有效的答案。谢谢。
NB：我试过使用Chrome和Firefox，都给了我相同的结果。

JavaScript

来源：https://stackoverflow.com/questions/51145373/simple-bootstrap-select-not-working

4条答案

按热度按时间

epggiuax1#

this link的依赖项部分有您的答案。
要使其工作，您需要：

jQuery版本1.8.0以上
Bootstrap 的下拉列表. js
Bootstrap 的CSS

如果您的项目中没有bootstrap，您可以添加minified version并根据需要对其进行定制，然后重新编译它。
PS不要使用 Bootstrap 版本4，因为它可能不工作。
希望能有所帮助!

赞(0）回复(0）举报 2023-01-16

arknldoa2#

- 试试这个，希望能有所帮助**：）

$(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>

赞(0）回复(0）举报 2023-01-16

ioekq8ef3#

看起来你需要包含Bootstrap的dropdown.js组件和Bootstrap的CSS。只有这样你才能使用bootstrap-select。Info在http://silviomoreto.github.io/bootstrap-select/的最上面。
看看这个小提琴https://jsfiddle.net/sairam0903/x9bm7qs8/2/

赞(0）回复(0）举报 2023-01-16

djmepvbi4#

在我的情况 Bootstrap 是不工作，因为我使用 Bootstrap 5和使用 Bootstrap 4 cdns，然后我切换到 Bootstrap 5和工作就像一个魅力.如果你想要得到3，4和5 Bootstrap cdns，你可以得到这些cdns从这个视频描述
https://www.youtube.com/watch?v=AyztNgccjJ8

赞(0）回复(0）举报 2023-01-16

我来回答

javascript 简单引导选择不起作用

4条答案

相关问题

热门标签

最新问答