select2 search - 只匹配以搜索词开头的词

select2 search - match only words that start with search term

我从 c​​hosen 迁移到 select2 插件,因为它对我来说效果更好,但与 chosen 相比,它的文档非常差。谁能告诉我应该使用什么选项来使 select2 搜索功能过滤仅以搜索词开头(并且中间不包含它)的词。

假设 select2 字段有这些选项:香蕉、苹果、菠萝。

当用户输入 "app"(或 apple)时,应该只返回 apple(因为它是唯一以 apple 开头的词)。现在,它 returns 苹果和菠萝。

经过大量搜索,我发现需要使用一些自定义匹配器,但仅此而已。

Select2 an example in the documentation 提供了有关如何使用自定义 matcher 函数将搜索词与搜索结果相匹配的信息。给出的示例正是这个用例。

function matchStart (term, text) {
  if (text.toUpperCase().indexOf(term.toUpperCase()) == 0) {
    return true;
  }
 
  return false;
}
 
$.fn.select2.amd.require(['select2/compat/matcher'], function (oldMatcher) {
  $("select").select2({
    matcher: oldMatcher(matchStart)
  })
});
<link href="//cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/css/select2.css" rel="stylesheet"/>

<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>

<select style="width: 200px">
  <option value="AL">Alabama</option>
  <option value="AK">Alaska</option>
  <option value="AZ">Arizona</option>
</select>

选择2 4.0.0

function matchStart(params, data) {
    params.term = params.term || '';
    if (data.text.toUpperCase().indexOf(params.term.toUpperCase()) == 0) {
        return data;
    }
    return false;
}

$("select").select2({
    matcher: function(params, data) {
        return matchStart(params, data);
    },
});