jquery-select2 – select2搜索 – 仅匹配以搜索词开头的单词

前端之家收集整理的这篇文章主要介绍了jquery-select2 – select2搜索 – 仅匹配以搜索词开头的单词前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我从选择迁移到select2插件,因为它对我来说效果更好,但与选择相比,它的文档非常差.谁能告诉我应该使用哪个选项来使select2搜索功能过滤以搜索词开头的词(并且不包含在中间).

让我们说select2字段有这些选项:香蕉,苹果,菠萝.

用户输入“app”(或苹果)时,只应返回apple(因为它是唯一以apple开头的单词).现在,它返回苹果和菠萝.

经过大量搜索后,我发现需要使用一些自定义匹配器,但到目前为止都是如此.

解决方法

Select2提供了有关如何使用自定义匹配器功能搜索词匹配到搜索结果an example in the documentation.给出的示例是这个确切的用例.
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>
原文链接:https://www.f2er.com/jquery/178360.html

猜你在找的jQuery相关文章