select2用法

样例（来自官方文档）
$("#e7").select2({
placeholder: “Search for a repository”,
minimumInputLength: 3,
ajax: {
url: “https://api.github.com/search/repositories”,
dataType: ‘json’,
quietMillis: 250,
data: function (term, page) { // page is the one-based page number tracked by Select2
return {
q: term, //search term
page: page // page number
};
},
results: function (data, page) {
var more = (page * 30) < data.total_count; // whether or not there are more results available

        // notice we return the value of more so Select2 knows if more results can be loaded
        return { results: data.items, more: more };
    }
},
formatResult: repoFormatResult, // omitted for brevity, see the source of this page
formatSelection: repoFormatSelection, // omitted for brevity, see the source of this page
dropdownCssClass: "bigdrop", // apply css that makes the dropdown taller
escapeMarkup: function (m) { return m; } // we do not want to escape markup since we are displaying html in results

});
常用事件
// 改变事件
$("#e11").on(“change”, function(e) {});
// select2 打开事件
$("#e11").on(“select2-open”, function(e) {});
// select2 关闭事件
$("#e11").on(“select2-close”, function(e) {});
// 选中事件
$("#e11").on(“select2-selecting”, function(e) {});
// 移除完毕事件。配置allowClear: true后触发
$("#e11").on(“select2-removed”, function(e) {});
// 加载中事件
$("#e11").on(“select2-loaded”, function(e) {});
// 获得焦点事件
$("#e11").on(“select2-focus”, function(e) {});
// 失去焦点事件
$("#e11").on(“select2-blur”, function(e) {});
函数
// 获取选中的ID值
$("#e1").select2(“val”));
// id=“CA” 选中（好像单个还不行，以数组形式才行）
$("#e2").select2(“val”, “CA”);
// 不选中任何值
$("#e2").select2(“val”, “”);
// 获取选中的对象
$("#e2").select2(“data”);
//设置选中的值：id=“CA”,text=“California”
KaTeX parse error: Expected 'EOF', got '#' at position 3: ("#̲e2").select2("d…("#e2").select2(“data”)));
//多选设值
$("#e2").select2(“data”, [{id: “CA”, text: “California”},{id:“MA”, text: “Massachusetts”}]);
参数
templateResult : formatState, // 列表带图片
templateSelection : formatState, // 选中的带图片

language: “zh-CN”, //设置 提示语言
width: “100%”, //设置下拉框的宽度
placeholder: “请选择”, // 空值提示内容，选项值为 null
//placeholder: {id: ‘’, text: “请选择”}, // 同上，这里默认空值为 ‘’
minimumInputLength: 10, //最小需要输入多少个字符才进行查询
maximumInputLength:11, //最大输入长度
allowClear: true, //是否允许手动点击删除
tags: false, // 根据搜索框创建option，默认false
selectOnClose: true, // 如果没有手动选中，下拉框消失后会自动选中被hover的选项 （不建议使用）
closeOnSelect: false, // 选择后下拉框不会关闭（单选-不建议使用）
minimumResultsForSearch: Infinity, // 隐藏搜索框
theme: “classic”, // 样式
separator: “,”,// 分隔符
data: initdata,// 下拉框绑定的数据
multiple: true,// 多选，默认false

maximumSelectionLength: 3, // 多选 - 设置最多可以选择多少项
tokenSeparators: [’,’, ’ '], // 多选 - 输入逗号和空格会自动完成一个选项 前提是：tags: true

//加载远程数据参数
escapeMarkup: function (markup) { return markup; }, //template的html显示效果，否则输出代码
formatResult:repoFormatResult,// 自定义下拉选项的样式模板。返回结果回调function repoFormatResult(repo){return repo.text},这样就可以将返回结果的的text显示到下拉框里。也可以自定义返回结果样式
formatSelection:repoFormatSelectionl // 自定义选中选项的样式模板。选中项回调function repoFormatSelection(repo){return repo.text}
旧版本设置初始值：

//设置初始值
initSelection:function(element, callback) {
var initData = {id:’’, text:‘默认值’}
callback(initData);
},

原文：https://blog.csdn.net/weixin_38384296/article/details/84317563
搜索框监听:
$(‘select[name=BatchSelect_WeekPlan]’).select2({
placeholder: ‘请选择’,
matcher:function (query, val) {
var txt = query.term;
var rTxt;
if (!txt || val.text.indexOf(txt) !== -1){
rTxt = val
}else {
rTxt = null;
setTimeout(function () {
cPihao()
},500)
}
return rTxt
}
});