1. 基本属性配置: 

$("#select2-id").select2({
templateResult : formatState, // 列表带图片
templateSelection : formatState, // 选中的带图片
language: "zh-CN", //设置 提示语言
width: "100%", //设置下拉框的宽度
placeholder: "请选择", // 空值提示内容,选项值为 null
//placeholder: {id: '', text: "请选择"}, // 同上,这里默认空值为 ''
minimumInputLength: 10 //最小需要输入多少个字符才进行查询
allowClear: true, //是否允许清空选中
tags: false, //设置必须存在的选项 才能选中,设置不存在的值则为null,如果 placeholder: {id: '', text: "请选择"} 则为 ''
selectOnClose: true, // 如果没有手动选中,下拉框消失后会自动选中被hover的选项 (不建议使用)
closeOnSelect: false, // 选择后下拉框不会关闭(单选-不建议使用)
minimumResultsForSearch: Infinity, // 隐藏搜索框
theme: "classic", // 样式
maximumSelectionLength: 3, // 多选 - 设置最多可以选择多少项
tokenSeparators: [',', ' '], // 多选 - 输入逗号和空格会自动完成一个选项 前提是:tags: true
});

  2. 常用基本操作:

2. 操作:
(1) 移除/销毁
  $("#select2-id").select2("destroy");

(2)清空下拉框列表值
  $("#select2-id").empty();

(3)设置下拉列表 
  // 单选 - 必须有一项为空值,否则默认选择第一项(如果必须选择一项可以不设置空值)
  $("#select2-id").append($("<option>", {value: '', text: '全部'}));
  $("#select2-id").append($("<option>", {value: 'value1', text: 'text1'}));
  $("#select2-id").append($("<option>", {value: 'value2', text: 'text2'}));

  // 多选 - 不能有一项为空值,否则再清空时会出BUG
  $("#select2-id").append($("<option>", {value: 'value1', text: 'text1'}));
  $("#select2-id").append($("<option>", {value: 'value2', text: 'text2'}));

(4)赋值
  // 赋值 - 单选
  $("#select2-id").val('value').trigger("change");

  // 赋值 - 多选
  $("#select2-id").val(['value1','value2']).trigger("change");

(5)获取中值
  // 多选返回数组,单选返回字符串
  $("#select2-id").val();

更多操作可参考:http://www.cnblogs.com/landeanfen/p/5099332.html

        http://www.cnblogs.com/cloudshadow/p/bootstrap_select2.html

bootstrap select2 使用简单介绍的更多相关文章

  1. BootStrap 按钮组简单介绍

    学会按钮组需要掌握以下几个类. btn   btn-group btn-toolbar  btn-group-vertical   和 下拉菜单的基本类 dropdown-toggle dropdow ...

  2. Appium Android Bootstrap源代码分析之简单介绍

    在上一个系列中我们分析了UiAutomator的核心源代码,对UiAutomator是怎么执行的原理有了根本的了解.今天我们会開始另外一个在安卓平台上基于UiAutomator的新起之秀--Appiu ...

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

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

  4. 对bootstrap modal的简单扩展封装

    对bootstrap modal的简单扩展封装 参考自:http://www.muzilei.com/archives/677   注:原文不支持bootstrap新版本,并且居中等存在问题 此段时间 ...

  5. SQLite数据库和JPA简单介绍

    SQLite数据库和JPA简单介绍 一.SQLite简单使用 SQLite是遵循ACID的关系数据库管理系统,它的处理速度很快,它的设计目标是嵌入式的,只需要几百K的内存就可以了. 1.下载SQLit ...

  6. 简单介绍什么是协程及其在ES6中的实现方式

    协程,英文名coroutine,是一种执行过程可以被暂停和恢复的方法.各个协程之间相互协作完成一个任务. 让我们来看一个关于发挥协程作用的例子.假定我们有一个生产者和消费者的关系,生产者创建物品并将物 ...

  7. [原创]关于mybatis中一级缓存和二级缓存的简单介绍

    关于mybatis中一级缓存和二级缓存的简单介绍 mybatis的一级缓存: MyBatis会在表示会话的SqlSession对象中建立一个简单的缓存,将每次查询到的结果结果缓存起来,当下次查询的时候 ...

  8. 利用Python进行数据分析(7) pandas基础: Series和DataFrame的简单介绍

    一.pandas 是什么 pandas 是基于 NumPy 的一个 Python 数据分析包,主要目的是为了数据分析.它提供了大量高级的数据结构和对数据处理的方法. pandas 有两个主要的数据结构 ...

  9. 利用Python进行数据分析(4) NumPy基础: ndarray简单介绍

    一.NumPy 是什么 NumPy 是 Python 科学计算的基础包,它专为进行严格的数字处理而产生.在之前的随笔里已有更加详细的介绍,这里不再赘述. 利用 Python 进行数据分析(一)简单介绍 ...

随机推荐

  1. flask-script组件

    Flask Script扩展提供向Flask插入外部脚本的功能,包括运行一个开发用的服务器,一个定制的Python shell,设置数据库的脚本,cronjobs,及其他运行在web应用之外的命令行任 ...

  2. 开发 | 微信小程序API-wx.setScreenBrightness/wx.getScreenBrightness

    前言 最近接触了微信小程序 API - wx.setScreenBrightness .wx.getScreenBrightness 接口,调用该接口可以调节并显示手机屏幕亮度数据.对于喜欢腾讯新闻. ...

  3. AIM Tech Round 4 (Div. 2)(A,暴力,B,组合数,C,STL+排序)

    A. Diversity time limit per test:1 second memory limit per test:256 megabytes input:standard input o ...

  4. HDU-5157Harry and magic string

    题目:http://acm.hdu.edu.cn/showproblem.php?pid=5157 先从后往前插点,在构造回文树时,让cnt[i]+=cnt[fail[i]],然后维护一个后缀和a. ...

  5. HDU 1241 DFS

    Oil Deposits Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)Tota ...

  6. 强连通分量&hdu_1269&Codeforce 369D

    强连通分量 标签: 图论 算法介绍 还记得割点割边算法吗.回顾一下,tarjan算法,dfs过程中记录当前点的时间戳,并通过它的子节点的low值更新它的low,low值是这个点不通过它的父亲节点最远可 ...

  7. redis安装、测试&集群的搭建&踩过的坑

    1 redis的安装 1.1   安装redis 版本说明 本教程使用redis3.0版本.3.0版本主要增加了redis集群功能. 安装的前提条件: 需要安装gcc:yum install gcc- ...

  8. 如何查看sublime安装了哪些插件

    你应该安装过package control. 那么只要这样:按ctrl+shift+p,输入package,选择list packages,就看到了. 或者直接查看Installed Packages ...

  9. CSS background-clip 属性

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  10. <c:forEach 的常用整理

    <c:forEach items="${images}" var="img" varStatus="status"> <d ...