关于bootstrap+selectpicker的坑

bootstrap-select中有一个控件叫selectpicker,提供原生select下拉框的一些额外功能,如果导入的时候不注意,就会出现下拉框不显示,显示了无法下拉等情况。在此记录一下解决办法。

selectpicker的使用需要有:jquery、bootstrap、bootstrap-select三个文件的支持。

  1. 引入jquery,这个是js文件
  2. 引入bootstrap的js和css文件

这里注意!!!1和2的顺序不能换!!!也就是说要先引入jquery再引入bootstrap!!!否则会出现下拉框无法下拉的问题!

bootstrap.js插件是基于jquery.js实现的,而我们的head之间的代码是从上往下解析执行加载的,所以要先引入jquery.js文件,方可使用bootrap.js。

最后引入bootstrap-select的js和css文件。

这里再注意!!!加入如下代码

<script type="text/javascript">
        $(window).on('load', function () {

            $('.selectpicker').selectpicker({
               
            });
        }); 
    </script>

这是将select初始化,如果不加的话会出现下拉框显示不出来的问题

这个坑花了将近一个小时去找解决方法.......

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值