前端select2插件使用
Select2是一款基于JQuery的下拉列表插件,支持普通的下拉单选、下拉分组选择、药丸盒子模型。并且支持数据的远程请求、动态加载,还提供了操作过程中各种事件的处理、内容格式的定制、内容搜索等功能;
一、快速使用:
1、普通下拉单选:
HTML:

JS:

显示效果:

2、药丸盒子:
修改普通下拉单选框的js代码为:

显示效果:

二、使用ajax设置数据源:
使用示例:

参数解释:
Url:ajqx要发出的数据请求地址;
dataType:设置返回数据的类型;
processResult:对请求返回的数据进行处理,整理成select2所需要的数 据格式;
Select2所接受的数据格式:(示例)

三、常用事件:

事件监听使用举例:

控制台显示:

四、常用操作:
1、打开关闭

2、数据操作:

注:
【1】获取的数据是一个数组,如果数据在填充的时候使用了id,那么返回的数组中每个元素就是选中项对应的id,否则就是实际选中的text值;设置值时也是如此;
【2】设置值之后一定要调用trigger函数触发change事件,让设置生效;
五、其他配置选项:


浙公网安备 33010602011771号