select2使用方法

来源：互联网发布：最新淘宝白菜群2017 编辑：程序博客网时间：2024/06/05 08:51

引用

<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/css/select2.min.css" rel="stylesheet" /><script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/js/select2.min.js"></script>

支持中文需要引用对应的语言包

select2_locale_zh-CN.js

    $("#e1").select2({        createSearchChoice:function(term, data) { //如果没有匹配到选项，自动将用户输入值封装成相应的数据对象            return {id:term, text:term};         },        formatResult:function(item){ //可自定义模板 下拉选项的模板            return item.text+' '+item.id;        },        ajax: {              url: "url", // 异步请求地址              dataType: "json", // 数据类型              delay: 250,//默认情况下，每当用户改变搜索条件后就会触发ajax请求，使用ajax.delay来限制请求时间间隔，单位ms            data: function(term, page) { // 请求参数（GET）                  return {                             wd: term                         };                   },            processResults: function (data) {//处理返回数据                return {                          results: data                       };                 },            escapeMarkup: function(m) {  //转义字符处理                return m;                  }            }              }).on('change',function(event){                //TODO:                change事件，event有三个属性 val、added、removed，分别对应当前对象，新选中的对象、删除的对象。                数据格式参考ajax返回的json格式            });

html页面

    <input id="e1" type="hidden"/>

0 0