Question

我试图以一种方式来修改select2 multiselect下拉列表的搜索功能，而不是搜索包含搜索字符的元素，我想搜索以搜索字符开头的元素。我已经提到了select2文档，但是他们说-

对于多选框，没有明显的搜索控件

那么这是否意味着我们没有任何变通办法来修改该功能？

我的要求示例：假设下拉列表包含4个元素，即

澳大利亚，阿根廷，印度，美国

，并且如果用户键入“ A”进行搜索，则会返回所有四个值，因为所有值中都带有“ A”。但是我的要求是仅返回以'A'开头的值，例如

澳大利亚和阿根廷

如何实现？

Answer 1

您可以使用matcher属性，要求它使用来修改搜索操作

select2.amd.require(['select2/compat/matcher'], ...)

请注意，此属性仅存在于select2（select2.full.js）的完整版本中

function search(term, text) {
  if (text.toUpperCase().indexOf(term.toUpperCase()) == 0) {
    return true;
  }
 
  return false;
}
 
$.fn.select2.amd.require(['select2/compat/matcher'], function (f) {
  $("select").select2({
    matcher: f(search)
  })
});

<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/js/select2.full.js"></script>
<link href="//cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/css/select2.css" rel="stylesheet" />

<select multiple style="width:100%;">
  <option>France</option>
  <option>Family</option>
  <option>Freezone</option>
</select>

提琴：https://jsfiddle.net/nx1eaLgz/

Select2 Multiselect Dropdown自定义搜索

1 个答案: