Я реализую дизайн, который показывает сообщение об ошибке непосредственно под ошибочными полями ввода. Сообщения об ошибках отображаются, когда:
- Поле теряет фокус
- Или нажата кнопка отправки
Моя текущая стратегия состоит в том, чтобы добавить описанную арию к полю (полям) ввода, которое ссылается на сообщение (я) об ошибке, и когда пользователь нажимает кнопку отправки, я выделю первое поле ввода с ошибкой, которое должно вызвать чтение сообщения. В полях ввода также будет правильно задан недействительный aria.
Это звучит правильно? Должен ли я вместо этого использовать role = alert? Я думаю, что последний будет путать пользователя, если есть несколько сообщений об ошибках с role = alert.
Кроме того, в какой момент времени программа чтения с экрана будет читать сообщение об ошибке? Что если он уже что-то читает? Будет ли он остановлен?
Вот пример:
<label>
Enter some value:
<input id="input" type="text" required aria-invalid="true" aria-describedby="errorMessage1 errorMessage2" />
</label>
<p id="errorMessage1">Error message 1</p>
<p id="errorMessage2">Error message 2</p>
Например, когда пользователь нажимает кнопку отправки и после того, как установлены все соответствующие атрибуты:
document.getElementById("input").focus()