jQuery 自动完成行在选择时突出显示

标签 jquery css jquery-ui autocomplete

我正在使用 jQuery UI Autocomplete .

当建议框出现并且用户按下向下键(或者他们将鼠标移到一个建议上)时,我需要突出显示整行。到目前为止,当按下向下键时,只有超链接的背景被突出显示。我尝试设计 ui-state-hover 类的样式,但它只用在 anchor 元素上。我不知道如何突出显示 li 元素。

到目前为止,这是我的 CSS:

.ui-state-hover, .ui-autocomplete li:hover
{
    color:White;
    background:#96B202;
    outline:none;
}

编辑: 为了更清楚一点,自动完成生成它的元素,如下所示:

<ul>
<li><a>an element</a></li>
<li><a>another element</a></li>
</ul>

当向下键被按下时, anchor 元素自动获得 ui-state-hover 类。

最佳答案

我遇到了完全相同的问题,解决方法是:

.ui-state-focus
{
    color:White;
    background:#96B202;
    outline:none;
}

关于jQuery 自动完成行在选择时突出显示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6424482/

相关文章:

iframe 中的 JavaScript 代码

jquery - 如何创建从 CSS 下拉菜单到幻灯片 2 上的 iframe 的链接

jquery-ui - 如何使用 jQuery UI 的 Highlight 和 Error 小部件?

javascript - 使用高度和宽度添加省略号

javascript - 我怎样才能获得点击按钮的ID?

javascript - 传递/改变 jQuery UI 拖动事件

javascript - &lt;script&gt; 标签内的 Yii2 Jquery 代码

javascript - 从 html 中删除 "bullet"符号

jQuery - 自动调整大小的文本输入(不是 textarea!)

html - CSS/HTML : Code for double down/up pointing angle