<!--[多选]则需要加上属性:multiple="multiple" -->
<select class="form-control" id="select2-id" multiple="multiple">
<option value="1" data-plantform="android">APP1</option>
<option value="1" data-plantform="ios">APP2</option> </select>

| 载入select2

var formatState = function (state) {
//console.log(state);
if (!state.id) {
return state.text; }
var $state = $('<span><img src="/public/images/'+state.element.dataset.plantform+'.jpg" style="width:25px;" /> '
+ state.text + '</span>'); return $state;
} $("#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
});

| 移除select2

$("#select2-id").select2("destroy");

| 清空下拉框列表值

$("#select2-id").empty();

| 设置下拉列表

// 单选 - 必须有一项为空值,否则默认选择第一项(如果必须选择一项可以不设置空值)
$("#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'}));

| 赋值说明:赋值会触发change事件

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

| 获取选中值

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

Select2使用示例地址: https://select2.github.io/examples.html
Select2参数文档说明: https://select2.github.io/options.html
 

bootstrap select2 参数详解的更多相关文章

  1. JVM的参数详解(转)

    12年毕业到先在处理第一年外这几年纯属于打酱油,当初自学Java然后就出来找工作了,还有第一家面试就通过了挺幸运的 但之后的这段时间一直是处于吃老本的状态.最近心情真的很不好,各种黄老邪!一直处于堕落 ...

  2. 反爬虫:利用ASP.NET MVC的Filter和缓存(入坑出坑) C#中缓存的使用 C#操作redis WPF 控件库——可拖动选项卡的TabControl 【Bootstrap系列】详解Bootstrap-table AutoFac event 和delegate的分别 常见的异步方式async 和 await C# Task用法 c#源码的执行过程

    反爬虫:利用ASP.NET MVC的Filter和缓存(入坑出坑)   背景介绍: 为了平衡社区成员的贡献和索取,一起帮引入了帮帮币.当用户积分(帮帮点)达到一定数额之后,就会“掉落”一定数量的“帮帮 ...

  3. Kafka单线程Consumer及参数详解

    请使用0.9以后的版本: 示例代码 Properties props = new Properties(); props.put("bootstrap.servers", &quo ...

  4. kubelet 参数详解

    kubelet 参数详解 基本参数 --allow-privileged=true #允许容器请求特权模式 --anonymous-auth=false #不允许匿名请求到 kubelet 服务(默认 ...

  5. Nginx主配置参数详解,Nginx配置网站

    1.Niginx主配置文件参数详解 a.上面博客说了在Linux中安装nginx.博文地址为:http://www.cnblogs.com/hanyinglong/p/5102141.html b.当 ...

  6. iptables参数详解

    iptables参数详解 搬运工:尹正杰 注:此片文章来源于linux社区. Iptalbes 是用来设置.维护和检查Linux内核的IP包过滤规则的. 可以定义不同的表,每个表都包含几个内部的链,也 ...

  7. chattr的常用参数详解

    chattr的常用参数详解 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 在实际生产环境中,有的运维工程师不得不和开发和测试打交道,在我们公司最常见的就是部署接口.每天每个人部署的 ...

  8. Bootstrap栅格系统详解,响应式布局

    Bootstrap栅格系统详解 栅格系统介绍 Bootstrap 提供了一套响应式.移动设备优先的流式栅格系统,随着屏幕或视口(viewport)尺寸的增加,系统会自动分为最多12列. 栅格系统用于通 ...

  9. mha配置参数详解

    mha配置参数详解: 参数名字 是否必须 参数作用域 默认值 示例 hostname Yes Local Only - hostname=mysql_server1, hostname=192.168 ...

随机推荐

  1. JQuery checkbox全选多次点击后无效解决方法

    1. jquery设置checkbox时: <input type="checkbox" id="ckAll"/> $(function(){ va ...

  2. xlrd(开excel表格)

    打来表格 wb = xlrd.open_workbook('example.xlsx') 选择sheet sh=wb.sheet_by_index(序号) 表格的行数 sh.nrows 选取第m行第n ...

  3. python实现二叉树

    初学python,需要实现一个决策树,首先实践一下利用python实现一个二叉树数据结构.建树的时候做了处理,保证建立的二叉树是平衡二叉树. # -*- coding: utf-8 -*- from ...

  4. spring security 跨域防伪攻击

    applicationContext-security.xml中配置 <http use-expressions="true" disable-url-rewriting=& ...

  5. mysql 视图示例

    基本操作 建立视图 CREATE VIEW view_test(qty,price,total) AS SELECT quantity,price,quantity*price FROM t; 多表视 ...

  6. 第一个shell脚本 结合计划任务下载远程文件

    思路: 进入/usr/local/apache2/htdocs/ipa/  循环读取 /root/shell/wget/down.txt  每次一行,每一行直接就是一条命令,直接 $line 就可以执 ...

  7. iOS 登陆之界面设置

    1.界面构成 1.1. 效果图 1.2. 元素 背景图 用户名的输入框 密码的输入框 登陆按钮 忘记密码 用户注册 第三方登陆 两个分割线

  8. Eclipse 输入出错时自动查找类

    经常会只记得类的前半部分名称,这时可以双击这个没写完的类名,然后会弹出选择框:

  9. Unity3D 相关技术

    slua相关shader编程相关animation相关attack check攻击检测相关

  10. Unity游戏开发——自动为动画剪辑添加事件 之 最后几帧的事件不能被调用的问题

    最近在做一个根据配置表自动生成动画剪辑clip以及controller的功能.做法是根据配置表配置的动作以及每个动作的关键帧,自动为每个clip添加事件.这样做可以把动画的事件处理在游戏运行之前就计算 ...