一、分别引入bootstrap-select.min.js和bootstrap-select.min.css文件

二、在页面中写一个class为selectpicker的select控件

  <select id="selectpicker" name="category" class="selectpicker" multiple data-live-search="true"></select>

三、绑定数据的方式很多(如需选中,设置data里的option为selected即可),例如:

 ()$("#selectpicker").html(data);
()$("#selectpicker").selectpicker("val",data);

四、绑定完数据之后一定要调用$('.selectpicker').selectpicker('refresh')方法来刷新一下控件

前端多选插件bootstrap-select的使用的更多相关文章

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

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

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

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

  3. JS前端图形化插件之利器Gojs组件(php中文网)

    JS前端图形化插件之利器Gojs组件(php中文网) 一.总结 一句话总结:php中文网我可以好好走一波 二.JS前端图形化插件之利器Gojs组件 参考: JS前端图形化插件之利器Gojs组件-js教 ...

  4. Wrangle – 响应式的,触摸友好的多选插件

    Wrangle 是一个响应式,触摸友好的选择插件,支持 jQuery 以及 Zepto.Wrangle 为多项选择提供了一个独特的方法:通过画一条贯穿项目的线条来选择项目.它给你的应用程序的一种新的方 ...

  5. WordPress 前端投稿/编辑插件 DJD Site Post(支持游客和已注册用户)

    转自:http://www.wpdaxue.com/front-end-publishing.html 说到前端用户投稿,倡萌之前推荐过3个不错的插件: WordPress匿名投稿插件:DX-Cont ...

  6. multiSelect 下拉多选插件

    multiSelect是一款很好用的下拉多选插件,可以在下拉框中实现多选框,全选及取消全选等方法.使用方法:1.引用 multiSelect.css及 multiSelect.js.下载地址 http ...

  7. js插件---Bootstrap 树控件

    js插件---Bootstrap 树控件 一.总结 一句话总结:可以直接用gojs,或者搜索js,jquery的树控件,或者bootstrap树控件,一大堆 gojs 二.JS组件系列——Bootst ...

  8. CDN公共库、前端开发常用插件一览表(VendorPluginLib)

    =======================================================================================前端CDN公共库===== ...

  9. Web前端学习笔记之BootStrap

    Bootstrap介绍 Bootstrap是Twitter开源的基于HTML.CSS.JavaScript的前端框架. 它是为实现快速开发Web应用程序而设计的一套前端工具包. 它支持响应式布局,并且 ...

随机推荐

  1. Python_queue单项队列

    队列(queue),实现程序间的松耦合 队列的三种类: class queue.Queue(maxsize)# 先进先出, maxsize 指定队列长度,线程安全的清况下,可以放入实例,对实例进行传输 ...

  2. zabbix4.0构建实录

    [Nginx] #wget -O /etc/yum.repos.d/epel.repo http://mirrors.aliyun.com/repo/epel-7.repo [root@centos ...

  3. day18常用模块之re模块

    简单认识正则表达式 正则测试工具:http://tool.chinaz.com/regex/ 元字符,单个字符匹配 . 匹配除换行符以外的任意字符 \w 匹配字母数字下划线(word) \s 匹配任意 ...

  4. c#关键字和常用类型表快查

    类型 字节 取值范围 说明 bool 1 true/false/null 布尔类型 char 2 0x0000~0xffff Unicode 16 位字符 byte 1 0~255 无符号的 8 位整 ...

  5. c++模板文件,方便调试与运行时间的观察

    #define _CRT_SECURE_NO_WARNINGS#include<iostream>#include <vector>#include<algorithm& ...

  6. 有关svn的报错

    由于目标计算机积极拒绝,无法连接.当报出这样的错的时候就是跨域的问题

  7. PeopleSoft如何查找jar包冲突

    PeopleSoft要查找jar包冲突问题,不像maven可以打印出所有依赖,但既然是在JVM上运行,就可以启用JVM参数 路经:%ps_cfg_home%\appserv\Domain 文件名:ps ...

  8. Laravel安装redis扩展

    Laravel安装redis扩展 1.使用命令行,执行(当然要先安装composer) composer require predis/predis 2.执行完就安装好了,redis相关配置可以到.e ...

  9. JS基础学习2

    1.CMAScript 运算符 算数运算符 递增(++).递减(--) var i=15; console.log(i++); console.log(i); var i1=15; console.l ...

  10. Codechef August Challenge 2018 : Interactive Matrix

    传送门 首先整个矩阵可以被分为很多小矩阵,小矩阵内所有行的单调性是一样的,所有列的单调性是一样的. 考虑如何在这样一个小矩阵中找出答案.我的策略是每次取四个角中最大值和最小值的点,这样可以每次删掉一行 ...