javascript - Bootstrap typeahead.js 不会突出显示自动完成文本框中的元素

Question

我已经尝试了所有可能的组合，以便在自动完成的下拉事件发生后让我的元素在鼠标悬停事件上突出显示(当然遵循文档)，仍然没有设法让我的突出显示的元素。

我真的不知道为什么这是一个这样的问题。

应该突出显示元素的 CSS 代码:

    .tt-suggestion.tt-cursor {
    background-color: #0097CF;
    color: #FFFFFF;
}

允许高亮元素的JS代码:

$('#the-basics .typeahead').typeahead({
  hint: true,
  highlight: true,
  minLength: 1
},

HTML 调用:

<div id="the-basics">
  <input class="typeahead">
</div>

有什么建议吗？

Answer 1

没有 fiddle 真的无法分辨。

但是您所说的负责突出显示的代码是错误的。应该是这个 .tt-suggestion:hover

更新

根据评论中给出的 fiddle .tt-suggestion.tt-cursor 确实存在并且样式应该适用于悬停。

但是，如果它不起作用，您可以尝试以下解决方案:

.tt-suggestion:hover {
  color: #fff;
  background-color: #0097cf;
}