bootstrap-select

周下载量 63,214

是bootstrap中select库下载量最多的。

https://www.npmjs.com/package/bootstrap-select

The jQuery plugin that brings select elements into the 21st century with intuitive multiselection, searching, and much more. Now with Bootstrap 4 support.

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

Bootstrap-select requires jQuery v1.9.1+, Bootstrap’s dropdown.js component, and Bootstrap's CSS. If you're not already using Bootstrap in your project, a precompiled version of the Bootstrap v3.4.1 minimum requirements can be downloaded here. If using bootstrap-select with Bootstrap v4+, you'll also need Popper.js. For all of Bootstrap v4's requirements, see Getting started. A precompiled version of the requirements will be made available in an upcoming release of bootstrap-select.

Usage

Via selectpicker class

Add the selectpicker class to your select elements to auto-initialize bootstrap-select.

<select class="selectpicker">
<option>Mustard</option>
<option>Ketchup</option>
<option>Barbecue</option>
</select>

Via JavaScript

// To style only selects with the my-select class
$('.my-select').selectpicker();

or

// To style all selects
$('select').selectpicker();

If calling bootstrap-select via JavaScript, you will need to wrap your code in a .ready() block or place it at the bottom of the page (after the last instance of bootstrap-select).

$(function () {
$('select').selectpicker();
});

Check out the documentation for further information.

DEMO

bootstrap-select的更多相关文章

  1. Bootstrap-风格的下拉按框:Bootstrap Select

    Bootstrap Select 是一个jQuery插件,提供了Bootstrap 风格的下拉选择框.拥有许多自定义的选项,可多选. 效果图: 源代码: <select class=" ...

  2. jq bootstrap select 点击不能动弹

    jq  bootstrap select 点击不能动弹   因为是样式selectpicker  冲突. 解决办法换 样式  form-control <select name="ty ...

  3. bootstrap select 多选的用法,取值和赋值(取消默认选择第一个的对勾)

    h5自带的select标签可以实现按住ctrl键多选的功能,但是样式及其难看. bootstrap select是很好用的前端插件 ​ 首先引入bootstrap和bootstrap-select的c ...

  4. bootstrap select 学习使用笔记-------选中赋值及change监听丢失

    在 bootstrap 和 knockout 共同存在下使用 select 下拉选择插件,发现绑定选项.赋值之后插件不可用了,绑定的监听事件也丢失了.迫不得已在绑定选项值之后再次调用刷新,以及赋值后重 ...

  5. Bootstrap select(选择列表)

    当您想让用户从多个选项中进行选择,但是默认情况下只能选择一个选项,则使用选择框 1.使用<select>展示列表选项 2.使用multiple="multiple"允许 ...

  6. Bootstrap select 多选并获取选中的值

    代码: <!DOCTYPE html><html> <head>    <meta charset="UTF-8">    < ...

  7. Bootstrap select多选下拉框实现代码

    前言 项目中要实现多选,就想到用插件,选择了bootstrap-select. 附上官网api链接,http://silviomoreto.github.io/bootstrap-select/. 没 ...

  8. bootstrap select多选

    1.页面效果 <div class="form-group"> <div class="col-md-2 control-label"> ...

  9. bootstrap select下拉框模糊搜索和动态绑定数据解决方法

    此方法适合后台一次性返回所有数据好了废话不多说直接上代码: <!DOCTYPE html><html><head> <title>Bootstrap-s ...

  10. 黄聪: 50 个 Bootstrap 插件

    Bootstrap是快速开发Web应用程序的前端工具包.它是一个CSS和HTML的集合,它使用了最新的浏览器技术,给你的Web开发提供了时尚的版式,表单,buttons,表格,网格系统等等. 本文向你 ...

随机推荐

  1. SQL注入(2)

    SQL注入id  title  content  time  author select * from news where id = 1; select 1,2,3,4,5,6 from table ...

  2. SpringCloud2.0 Hystrix Feign 基于Feign实现断路器 基础教程(七)

    1.启动[服务中心]集群,工程名:springcloud-eureka-server 参考 SpringCloud2.0 Eureka Server 服务中心 基础教程(二) 2.启动[服务提供者]集 ...

  3. 实验十四 团队项目评审&课程学习总结(葛进花201671010413)

    实验十四 团队项目评审&课程学习总结 项目 内容 这个作业属于哪个课程 软件工程 这个作业的要求在哪里 实验十四 作业学习目标 1)掌握软件编码实现的工程要求 2) 反思总结课程学习内容 任务 ...

  4. wordpress数字分页列表导航实现

    前面我们用了自定义的方式来实现wordpress数字分页,其实wordpress是已经有集成了Numbered Pagination相关的函数,我们直接调用就可以.具体实现方法如下代码调用 <? ...

  5. windows cmd命令查看端口占用进程

    netstat –ano|findstr [指定端口号] 通过任务管理器杀死相关的进程 方法一:使用任务管理器杀死进程打开任务管理器->查看->选择列->然后勾选PID选项,回到任务 ...

  6. Netflix-mantis 实时数据流开发平台

    mantis 是netflix 开源的已经在netflix 使用了多年的实时流处理平台,目前从官方文档的介绍,在netflix使用场景很多 使用场景 上下文报警 监控netflix 的微服务 异常追踪 ...

  7. python3 安装 pillow报错

    前言 最近要使用pillow库, 来训练验证码模型, 但是死活都安装不上 环境 docker中安装, python3 尝试安装 pip install pillow easy_install Pill ...

  8. 因子分解机 FM

    特征组合 人工方式的特征工程,通常有两个问题: 特征爆炸 大量重要的特征组合都隐藏在数据中,无法被专家识别和设计 针对上述两个问题,广度模型和深度模型提供了不同的解决思路. 广度模型包括FM/FFM等 ...

  9. .NET总结--WebService 配置与设置,发布

    发环境 OS:win10 企业版 开发工具:VS2017 IIS版本:6.0 .NET版本:4.6.1 Web Service 简介 Web Service也叫XML Web Service WebS ...

  10. exception The absolute uri: [http://java.sun.com/jsp/jstl/core] cannot be resolved in either web.xml or the jar files deployed with this application

        1.情景展示 eclipse,运行web项目时,报错信息如下: The absolute uri: [http://java.sun.com/jsp/jstl/core] cannot be ...