javascript – Select2,当没有选项匹配时,应显示“other”

前端之家收集整理的这篇文章主要介绍了javascript – Select2,当没有选项匹配时,应显示“other”前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
使用select2下拉列表,如果没有选项与用户输入的输入相匹配,如何显示默认选项?
$("something").select2({
  formatNoMatches: function(term) {
    //return a search choice
  }
});

我无法在select2文档或Stack Overflow中找到任何与所需功能相匹配的内容.

编辑
我越来越接近这个了

$("something").select2({
  formatNoMatches: function(term) {
    return "<div class='select2-result-label'><span class='select2-match'></span>Other</div>"
  }
});

但这很糟糕,而且也无法点击.

解决方法

补充@ vararis的答案:

选择2附加到< select> element不允许自定义createSearchChoice或查询函数,因此我们需要手动添加一个option元素(我将它添加为元素的最后一个选项,这样我们就可以轻松地将.pop它从结果集中删除):

<select>
  ...
  <option value="0">Other</option>
</select>

然后传递自定义匹配器功能,以便始终匹配此“其他”选项.

注意:Select2 3.4使用different default matcher而不是文档中当前显示的那个,这个新的使用stripDiacritics函数调用,例如匹配á.因此,我将应用页面中包含的Select2版本附带的默认匹配器,将其默认匹配算法应用于任何不是“其他”选项的选项:

matcher: function(term,text) {
  return text==='Other' || $.fn.select2.defaults.matcher.apply(this,arguments);
},

最后,除了“其他”结果(最初总是在结果集中)之外的任何结果时,我们需要从结果集中删除“其他”选项:

sortResults: function(results) {
  if (results.length > 1) results.pop();
  return results;
}

Demo

原文链接:https://www.f2er.com/js/150197.html

猜你在找的JavaScript相关文章