listbox

Составная роль виджета из WAI-ARIA для выпадающего списка с несколькими опциями на выбор. В таком списке может быть не только текст, но и картинки.

В HTML эта роль есть у <datalist> и <select> с атрибутами multiple и size со значением больше 1.

Задайте role="listbox" любому тегу, лучше всего <div>, <span> или <select>.

Внутри элемента с ролью listbox должен быть один или несколько с ролью option. Эта роль есть у <option> по умолчанию.

ARIA-роли не изменяют внешний вид и поведение элементов, поэтому не забудьте стилизовать список и добавить поддержку клавиатуры с помощью JavaScript и tabindex, когда используете неинтерактивный элемент.

Элемент listbox может быть частью комбинированного списка с combobox. Их связывают с помощью aria-controls.

Для listbox можно также использовать все глобальные ARIA-атрибуты, атрибуты виджетов aria-errormessage, aria-expanded, aria-invalid, aria-multiselectable, aria-orientation, aria-readonly, aria-required, и ещё один атрибут связи aria-activedescendant.

По умолчанию у роли listbox есть aria-orientation со значением vertical.