1.官网 地址 https://select2.github.io/
2. 使用
<!-- select2 --> <link rel="stylesheet" href="${ctx}/static/comp/select2/css/select2.min.css"> <script src="${ctx}/static/comp/select2/js/select2.min.js"></script>
<select id="port_id" class="form-control"> <option>全部</option> <option>站点001</option> <option>站点002</option> </select>
<script > $(function (){ $("#port_id").select2({ width:"100px", minimumResultsForSearch: -1 }); }); </script>
3 .api
width 宽度 字符串
minimumResultsForSearch 设置为 -1 ,去掉 搜索框
placeholder 选择框中 显示的提示文字
allowClear: true 是否有 清除的符号(有个叉号 点击清除 )
4.说明
(1)select2 的 数据源属性为 id 、text; id为value,text为select标签显示的字符串
(2)有两种数据源加载方式
静态数组的数据源:
<script type="text/javascript">
var data = [{ id: 0, text: 'enhancement' }, { id: 1, text: 'bug' }, { id: 2, text: 'duplicate' }, { id: 3, text: 'invalid' }, { id: 4, text: 'wontfix' }];
$(".js-example-data-array").select2({ data: data }) $(".js-example-data-array-selected").select2({ data: data }) </script> <select class="js-example-data-array"></select> <select class="js-example-data-array-selected"> <option value="2" selected="selected">duplicate</option> </select>
另一种是 ajax方式
$("#area").select2({ width:"200px", minimumResultsForSearch:-1, placeholder:"请选择", ajax: { url: path + "/province/provinceCombobox", dataType: 'json', delay: 200, processResults: function (data, params) { // 如果 接口数据 格式 格式 id、text 则 转化一下 data = $.map(data, function (obj) { obj.id = obj.id || obj.code; obj.text = obj.text || obj.name; return obj; }); return { results: data }; } } }); //ajax 返回 id、text 为对象的 数组;关键 的地方 processResults 函数中 处理返回值 { results: data};
相关推荐
angularjs中select2使用demo,经过测试没问题。其中含有js,css文件
select2的几种常用方法总结,把代码放到相应的地方就能使用了。不过前提需要下载select2哦!
1、Select2使用示例地址:https://select2.github.io/examples.html 、http://select2.github.io/select2/ 2、Select2参数文档说明:https://select2.github.io/options.html 3、Select2源码:...
。。。
。。。
主要为大家介绍了JS组件Bootstrap Select2使用方法,感兴趣的小伙伴们可以参考一下
简单实用的jquery select2组件
jquery select2 select美化插件
用于更好的展示和进行搜索,使用select2搜索框,使你的搜索更加简单
JavaScript 技术: select2控件选择多个数据,以及回显数据的方法 。
select2的新版中文语言包。下载后直接引入即可。放在select2.full.min.js后引入语言包。在代码里加入 language: "zh-CN"即可。
select2.min.js插件!!!=
此压缩包内含有select2.min.css、select2.min.js和jquery-1.9.1.min.js,在使用Select2 ajax时使用方便,谢谢下载!
基于select2和jquery-ztree实现的树形下拉框。支持单选,多选。
bootstrap整合select2和ztree实现下拉框带树结构,select2+ztree下拉效果
jquery select2 html select 内容搜索 下拉框搜索
django-easy-select2, 可以选择 Django的Select2输入小部件 这是 Django 应用程序,它使select2小部件在管理中选择输入。 项目旨在支持英镑 python and 3.4 ( 至少) Django 1.8 。这个 Django 应用程序只是Select2库...
select2资源包。里面包含select2相关的js、css,解压后在dist目录下可找到。使用select2需要搭配jquery1.8以上版本。在这资源包的vendor文件夹下有jquery2.1的版本