select2 使用
<link href="/plugin/select2/css/select2.min.css" rel="stylesheet" />
<script src="/plugin/select2/js/select2.min.js"></script>
1.处理
$('#spec1_cont').select2({
placeholder: "请选择",
allowClear: true
});
2.获取选择的id
var spec1_cont_val = $('#spec1_cont').select2("val");
3.获取选择的内容和id
var spec1_cont_val = [];
$("#spec1_cont option:checked").each(function(i){
spec1_cont_val[i] = $(this).val()+'-'+$(this).text(); // 1-红色 3-绿色
})
var spec2_cont_val = [];
$("#spec2_cont option:checked").each(function(i){
spec2_cont_val[i] = $(this).val()+'-'+$(this).text();
})
4.默认选择
if (default_val_arr) { // ['1','3']
$("#spec1_cont").val(default_val_arr).trigger('change');//设置select的默认值
}
select2 使用的更多相关文章
- 利用Select2优化@Html.ListBoxFor显示,学会用MultiSelectList
最近需要用到多选框,Asp.Net MVC自带的@Html.ListBox或@Html.ListBoxFor的显示效果太差,于是找到了Select2进行优化,并正式了解了多选框的操作方法. 首先介绍多 ...
- ajax获取json数据 for select2
json数据“a.json” [ { "id": "1", "text": "张三" }, { "id&quo ...
- select2 demo
https://select2.github.io/examples.html 一大堆的坑: 1. 不同版本之间貌似不兼容,对应版本看对应的文档. 2. 4.0.3版本: 1). 自定义渲染的opti ...
- 解决select2在bootstrap的modal中默认不显示的问题
在Bootstrap中的Modal,select2插件会有不显示,因为其z-index小于modal,还有另外一个问题是,修正z-index之后,select2不会自动失去焦点的问题.代码解决如下: ...
- select2 清空数据
最近用select2插件,发现用jquery重置不好使,最后搜罗了一把发现下面这个方法可以间接的实现,有空还得看看插件的API $('#integratorId').select2('data', n ...
- select2插件不兼容ie7,ie7下样子显示错位问题
1.源文件(未修改) select2.min.css.select2.min.js 2.ie7下显示样式: 3.ie8下显示样式: 4.经查看发现ie7下对一些属性的解析和ie8不同,需对ie7另作h ...
- select2的相关问题
在弹出框中无法使用select2的问题: 通常情况下,使用select2只需要在加载相关js和css后,添加如下代码即可: $("#selectId").select2(); 但如 ...
- bootstrap与Select2使用小结
这个select2组件的功能确实很强大,可以将图片放入到select里面随着文字一起显示. 组件的下载地址以及API说明地址: 1.Select2使用示例地址:https://select2.gith ...
- 解决Select2控件不能在jQuery UI Dialog中不能搜索的bug
本文使用博客园Markdown编辑器进行编辑 1.问题呈现 项目中使用了jQuery UI的Dialog控件,一般用来处理需要提示用户输入或操作的简单页面.逻辑是修改一个广告的图片和标题. 效果截图如 ...
- JS组件系列——Bootstrap Select2组件使用小结
前言:在介绍select组件的时候,博主之前分享过一篇JS组件系列——两种bootstrap multiselect组件大比拼,这两个组件的功能确实很强大,只可惜没有图文结合的效果(也就是将图片放入到 ...
随机推荐
- 基于EasyNVR摄像机无插件直播流媒体服务器实现类似于单点登录功能的免登录直播功能
提出问题 EasyNVR是一套摄像机无插件直播的流媒体服务器软件,他可以接入各种各样的摄像机,再经过转化统一输出无插件化直播的RTMP.HLS.HTTP-FLV流,同时,EasyNVR为了数据安全,提 ...
- Oracle 逻辑体系
Oracle 逻辑体系 主题 Oracle 逻辑体系 参考资料 Oracle 逻辑体系 表空间.模式.用户.段.区.块 Oracle中的数据逻辑上存储于表空间,物理上则存储于属于表空间tabl ...
- kafka 集群安装过程
1.下载需要的安装包 http://kafka.apache.org/downloads.html 本文使用的 Scala 2.9.2 - kafka_2.9.2-0.8.2.2.tgz (asc, ...
- ehcache 常用配置项详解(三)
EhCache 给我们提供了丰富的配置来配置缓存的设置: 这里列出一些常见的配置项: cache元素的属性: name:缓存名称 maxElementsInMemory:内存中最大缓存对象数 maxE ...
- Android系统移植与调试之------->如何使用PhotoShop转换24位的bmp图片为16位bmp图片
使用Android移植时候,很多图片都需要16为的bmp格式,所以研究了一下如何从24位转换成16位,供大家参阅 step1:查看bmp图片的属性,如下图所示,是24位的 step2:用PhotoSh ...
- Linux中的系统默认日志
/var/log/cron 记录了系统定时任务相关的日志 /var/log/cups 记录了打印信息的日志 /var/log/dmesg 记录了系统在开机时内核自检的信息,可以通过dmesg命令直接查 ...
- Win10在右键菜单添加“在此处打开命令窗口”设置项
Windows Registry Editor Version 5.00 [HKEY_CLASSES_ROOT\Directory\shell\OpenCmdHere] @="在此处打开命令 ...
- 剑指offer 面试45题
面试45题: 题:把数组排成最小的数 题目:输入一个正整数数组,把数组里所有数字拼接起来排成一个数,打印能拼接出的所有数字中最小的一个.例如输入数组{3,32,321},则打印出这三个数字能排成的最小 ...
- Android:日常学习笔记(9)———探究广播机制
Android:日常学习笔记(9)———探究广播机制 引入广播机制 Andorid广播机制 广播是任何应用均可接收的消息.系统将针对系统事件(例如:系统启动或设备开始充电时)传递各种广播.通过将 In ...
- IDA 调试 Android 方法及简单的脱壳实现
IDA 调试 Android 方法及简单的脱壳实现 标签: android原创逆向调试dalvik 2016-05-24 14:24 9286人阅读 评论(3) 收藏 举报 分类: 原创(25) An ...