代码之家 › 专栏 › 技术社区 › Michael Harley Pawan Maheshwari

简单引导选择不工作

bootstrap-select css html jquery javascript

1

Michael Harley Pawan Maheshwari · 技术社区 · 8 年前

<!文档类型HTML>
<HTML>
<头部>
<标题></title>
<link rel=“stylesheet”type=“text/css”href=“bootstrap select.min.css”>
</head>
<正文>
<select class=“selectPicker”>
<选项>选择</选项>
<选项>1</选项>
<选项>1</选项>
</选择>

<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(函数()。{
$('.selectPicker').selectPicker();
(});
</script>
</body>
</html>
我有这个密码。
我正在使用jquery 3.3.1
我使用bootstrap select fromhttps://github.com/silviomoreto/bootstrap select并将其复制到本地以节省一些加载时间。
但是当我尝试运行这个时,我得到了这个结果:



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


注意:我尝试使用chrome和firefox,结果都是一样的。

我有这个密码。
我正在使用jquery 3.3.1
我使用了引导程序从中选择https://github.com/silviomoreto/bootstrap-select并将其复制到本地以节省一些加载时间。
但是当我尝试运行这个时,我得到了这个结果:



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

注意:我试过使用Chrome和Firefox,结果都是一样的。

3 回复 | 直到 8 年前

1

0

CR34T0R 8 年前

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

要实现这一目标,您需要:

jquery 1.8.0版+
引导下拉.js
引导程序的CSS

如果项目中没有引导程序,可以添加 minified version 并根据您的需要定制它,然后重新编译它。

PS不使用引导版本4,因为它可能不工作。

希望有帮助!

2

1

Sai Ram Gupta 8 年前

看起来您需要包括bootstrap s dropdown.js组件和bootstrap的css。只有这样你才能使用 bootstrap-select . 信息在最上面 http://silviomoreto.github.io/bootstrap-select/ .

看看这个小提琴 https://jsfiddle.net/sairam0903/x9bm7qs8/2/

3

0

Joji 8 年前

试试这个,希望能有所帮助 :)

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