bootstrap-select使用

github地址
https://github.com/snapappointments/bootstrap-select/

css

<link href="../static/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<link href="../static/bootstrap/css/bootstrap-select.min.css" rel="stylesheet">

js(注意:bootstrap不带popper,所以要单独引用popper.min.js,而且这个popper.min.js必须在bootstrap.min.js前引用)

<script src="../static/js/jquery.min.js"></script>
<script src="../static/bootstrap/js/popper.min.js"></script>
<script src="../static/bootstrap/js/bootstrap.min.js"></script>
<script src="../static/bootstrap/js/bootstrap-select.min.js"></script>

使用方式

<select id="my_picker" class="selectpicker" title="选择语言">
 <option value="1">C#</option>
 <option value="2">JAVA</option>
 <option value="3">PYTHON</option>
</select>

效果图
在这里插入图片描述
获取选中值的方式

$("#my_picker").val()

或者

$("#my_picker").selectpicker("val")

如果要设置选中事件可以写

$('#my_picker').on('changed.bs.select',function(e){
  console.log(e.target.value);
});
发布了70 篇原创文章 · 获赞 56 · 访问量 2万+

猜你喜欢

转载自blog.csdn.net/zhangenter/article/details/104202079