想使用Select2组件必须引用：select2.min.css和select2.min.js两个文件：如下：

页面写法很简单：

在这里多选是没有搜索功能的，只有单选的时候才会有搜索功能。

Select2的数据源最起码得有Id和text两个字段

下面就是Select2的数据处理了：

这里的item的数据为:

效果如下：

当Select2与模态框一起使用的时候，把模态框的tabindex="-1"属性去掉，不然select2会出问题。

BootStrap Select2组件的更多相关文章

  1. JS组件系列——Bootstrap Select2组件使用小结

    前言:在介绍select组件的时候,博主之前分享过一篇JS组件系列——两种bootstrap multiselect组件大比拼,这两个组件的功能确实很强大,只可惜没有图文结合的效果(也就是将图片放入到 ...

  2. 转载 JS组件Bootstrap Select2使用方法详解

    JS组件Bootstrap Select2使用方法详解 作者:懒得安分 字体:[增加 减小] 类型:转载 时间:2016-01-26我要评论 这篇文章主要为大家介绍了JS组件Bootstrap Sel ...

  3. JS组件系列——两种bootstrap multiselect组件大比拼

    前言:今天继续来看看bootstrap的另一个组件:multiselect.记得在项目开始之前,博主项目组几个同事就使用哪些js组件展开过讨论,其中就说到了select组件,由于项目的整体风格使用的b ...

  4. 详解Bootstrap缩略图组件及警示框组件

    缩略图组件 缩略图在网站中最常用的就是产品列表页面,一行显示几张图片,有的在图片底下带有标题.描述内容.按钮等信息.bootstrap框架将这部分独立成一个模块组件,通过类名.thumbnail配合b ...

  5. BootStrap常用组件及响应式开发

    BootStrap常用组件 PS:所有的代码必须写在<class="container/container-fluid">容器当中 常用组件包含内容: 字体图标 下拉菜 ...

  6. 【转载】BootStrap表格组件bootstrap table详解

    (转载,来源“脚本之家”,作者不详) 一.Bootstrap Table的引入 关于Bootstrap Table的引入,一般来说还是两种方法: 1.直接下载源码,添加到项目里面来.由于Bootstr ...

  7. Sweetalert模态对话框与Swiper轮播插件、Bootstrap样式组件、AdminLTE后台管理模板地址

    Sweetalert纯JS模态对话框插件地址:http://mishengqiang.com/sweetalert/ AdminLTE后台管理模板系统地址(基于Bootstrap):https://a ...

  8. Bootstrap Blazor 组件库 Row 布局组件（栅格系统）

    原文链接:https://www.cnblogs.com/ysmc/p/16133351.html 在 Bootstrap 中,栅格相信大家都很熟悉,简直就是布局神器啊,Bootstrap Blazo ...

  9. JS组件系列——分享自己封装的Bootstrap树形组件：jqTree

    前言:之前的一篇介绍了下如何封装自己的组件,这篇再次来体验下自己封装组件的乐趣.看过博主博客的园友应该记得之前分享过一篇树形菜单的使用JS组件系列——Bootstrap 树控件使用经验分享,这篇里面第 ...

随机推荐

  1. 【Java 安全技术探索之路系列：J2SE安全架构】之二：安全管理器

    作者:郭嘉 邮箱:allenwells@163.com 博客:http://blog.csdn.net/allenwells github:https://github.com/AllenWell 一 ...

  2. Matplotlib绘图基础

    import matplotlib.pyplot as plt import numpy as np #绘图流程 x=np.linspace(-1,1,100) y=x**2 plt.plot(x,y ...

  3. 菜鸟Sublime日记

            一.进行系统安装:www.sublimetext.com/3   选择相应的操作系统,你会发现安装速度惊人的快. 二.安装完成以后,先安装两个基本的插件package control ...

  4. 嵌入式开发之dmva---基于DMVA2平台720P高清智能分析

    http://wenku.baidu.com/view/2190746ba45177232f60a2b8.html

  5. 嵌入式linux 实现mdev SD卡和U盘自己主动挂载和卸载的方法 mdev.conf

    首先先參考这些博客做一些了解:http://linux.chinaunix.net/techdoc/install/2009/11/18/1144936.shtml http://www.cnblog ...

  6. ie6不支持png图片的解决办法

    在head里引入png.js文件 <!--[if lte IE 6]> <script type="text/javascript" src="js/P ...

  7. Hibernate 之 Why?

    本文主要是从一个宏观的角度来认识Hibernate,对为什么用Hibernate进行一些说明,通过指导并了解Hibernate的特性及其优缺点可以让我们在以后的项目中根据具体的情况进行选择. Hibe ...

  8. Lucene Core Solr

    Apache Lucene - Welcome to Apache Lucene https://lucene.apache.org/ The Apache LuceneTM project deve ...

  9. 构造json参数时key的引号和js string转json的三种方式

    {name:"dd",age:"16"} {"name":"dd","age":"16&q ...

  10. Genymotion设置网络桥接

    1,打开Genymotion,找到对应的模拟器,点击“设置”按钮 2,在网络选项中选择桥接 Bridge