Question

我正在使用jQuery Autocomplete插件，我想在Google的自动完成功能中实现相同的操作：

我已经搜索了这个，但是所有的例子都在显示，我怎么能突出显示匹配的单词，但是我想要对应的单词：

例如，如果我输入：acc - ＆gt;我想要 ount ，acc 经理

有人为此解决了一些问题吗？

由于 NIK

Answer 1

这似乎是一个CSS问题。我将使用Twitter Bootstrap Typeahead作为示例。

这些是重要的插件默认值：

menu: '<ul class="typeahead dropdown-menu"></ul>'
item: '<li><a href="#"></a></li>'

荧光笔只是将突出显示的部分包装在标签中，如下所示：

highlighter: function (item) {
  var query = this.query.replace(/[\-\[\]{}()*+?.,\\\^$|#\s]/g, '\\$&')
  return item.replace(new RegExp('(' + query + ')', 'ig'), function ($1, match) {
    return '<strong>' + match + '</strong>'
  })
}

简单的预先输出看起来像：

<ul class="typeahead dropdown-menu">
    <li><a href="#"><strong>test</strong>ing</a></li>
</ul>

这意味着在最简单的设置中，您可以添加一些基本的CSS，如此

.typeahead  > li > a {
font-weight: bold;
}

.typeahead  > li > a strong {
font-weight: normal;
}

Jquery Autocomplete突出显示Google之类的不匹配文本

1 个答案: