Кратко
СкопированоСвойство виджета из WAI-ARIA. Указывает на то, что элемент нельзя изменять, но с ним всё равно можно взаимодействовать.
Так же работает HTML-атрибут readonly
.
Пример
Скопировано<span role="checkbox" aria-labelledby="label" aria-checked="true" aria-readonly="true"></span><span id="label">Не против обработки моих данных</span>
<span role="checkbox" aria-labelledby="label" aria-checked="true" aria-readonly="true"></span> <span id="label">Не против обработки моих данных</span>
Как пишется
СкопированоДобавьте к тегу атрибут aria
с одним из значений:
true
— в элемент нельзя ничего ввести или изменить его.false
(по умолчанию) — в элемент можно ввести или изменить в нём данные.
aria
можно задавать только некоторым тегам и ролям:
<textarea>
,<input>
с типамиtext
,email
,tel
,url
или для ролиtextbox
.<input type
или= "checkbox"> checkbox
.<input type
или= "number"> spinbutton
.<select>
илиcombobox
,listbox
.<input type
или= "range"> slider
.<div>
,<span>
илиgeneric
.radiogroup
.grid
.gridcell
.
Для <input>
лучше использовать атрибут readonly
, если он поддерживается в нужном типе поля.
Как понять
СкопированоНа элементе с aria
пользователи могут сделать фокус, узнать о его роли и состоянии, а также скопировать из него данные.
Такое поведение может быть у элементов формы с неизменяемыми, автоматически подгружаемыми данными, автоматические рассчитанной ценой как в корзине с товарами, а ещё у заголовков сеток.