Плагин при инициализации создает дополнительные HTML-элементы:
<input type="text" id="suggestions"/> |
$('#suggestions').suggestions({ ... }); |
<input type="text" id="suggestions" class="suggestions-input" /> <div class="suggestions-wrapper"> <div class="suggestions-suggestions"> <div class="suggestions-hint">Выберите вариант ниже или продолжите ввод</div> <div class="suggestions-suggestion suggestions-selected">...</div> <div class="suggestions-suggestion">...</div> <div class="suggestions-suggestion">...</div> </div> <i class="suggestions-preloader"></i> <ul class="suggestions-constraints"></ul> </div> |
Внешний вид элементов настраивается CSS-классами:
Класс | Описание |
---|---|
.suggestions-suggestions | Список подсказок |
.suggestions-suggestion | Элемент списка подсказок |
.suggestions-selected | Выбранный элемент списка подсказок |
.suggestions-suggestions strong | Подсветка части элемента списка, совпадающей с запросом |
.suggestions-hint | Поясняющий текст, который показывается в выпадающем списке над подсказками |
.suggestions-preloader | Крутящийся индикатор (показывается во время ожидания ответа от сервера) |
.suggestions-constraints | Ограничения поиска |