Подсветка строк автозаполнения jQuery при выборе

Question

Я использую jQuery UI Autocomplete .

Когда появляется окно с предложением и пользователь нажимает клавишу «Вниз» (или они наводят указатель мыши на одно предложение), мне нужно полностьюстрока должна быть выделена.Пока при нажатии клавиши «Вниз» подсвечивается только фон гиперссылки.Я попытался стилизовать класс ui-state-hover, но он используется только для элемента привязки.Я не могу понять, как выделить элемент 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>

при нажатии клавиши вниз элемент привязки автоматически получает класс ui-state-hover.

Answer 1

У меня была точно такая же проблема, я решил ее:

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

Answer 2

Будучи новичком в CSS, я не видел этого раньше: мне нужно было только сделать стиль элемента привязки display:block.На случай, если кто-нибудь снова столкнется с этим.

Answer 3

Вы можете использовать события:

yourElement.autocomplete({
        focus: function(event, ui) { console.log(var li = $(event.srcElement).parent()); },
});

li переменная это то, что вам нужно. Вы можете изменить стиль или добавить класс так, как вам нравится.