jquery ui自动完成中悬停和箭头键导航的不同背景颜色

Question

我已经为我的问题做了一个 jsfiddle。

Link to my jsfiddle

问题是，当我使用鼠标悬停在列表上时，我得到了我想要的背景悬停颜色。但是，当我使用箭头键导航时，jquery ui 默认主题颜色生效。这将创建两组背景颜色，一组使用鼠标，另一组使用箭头键。我尝试过使用

.ui-menu-item .ui-menu-item-wrapper:focus 

但没有成功。我正在使用 jquery ui 1.12.1 和 jquery 1.10.2。如何在这两个事件中设置我想要的背景颜色和文本颜色？

提前致谢。

Answer 1

我找到了负责这个的类。查看 jquery ui 主题滚轮的 css 文件给了我线索。

.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active,
a.ui-button:active,
.ui-button:active,
.ui-button.ui-state-active:hover {
    border: 1px solid #aaaaaa;
    background: #cfd8e0;
    font-weight: normal;
    color: #212121;
}

现在我在使用箭头键悬停或导航列表时具有相同的效果。