У меня есть следующие требования:
На моей веб-странице есть якорные ссылки для навигации (например, skip to content и т. Д.).Эти якоря должны отображать целевой элемент и фокусировать его.(Фокус важен, потому что в противном случае программы чтения с экрана неправильно позиционируются. Пока мой код выглядит так:
<a href="#content" class="navbtn">Skip to content</a>
<!-- somewhere else...-->
<div id="content" tabindex="-1">
Lorem ipsum...
</div>
<script>
$(".navbtn").click(function(e) {
e.preventDefault();
$("#content").focus();
});
</script>
Обратите внимание, что я знаю, что это жестко, и я изменю это вв будущем, но для целей тестирования я оставил это так.
ОК, так что это делает? В этом посте было сказано, что описанный выше метод фокусирует элемент div. Визуально я не могу судить, но программа чтения с экрана не будет перемещаться к элементу (я использую VoiceOver в Safari на iPhone). Если целью является кнопка, ссылка или любой другой элемент, который по умолчанию имеет tabindex, он работает нормально.
Есть идеи?
РЕДАКТИРОВАТЬ: я получил, чтобы он работал с моим дисплеем Брайля при нажатии левой клавиши режима. Я обычно использую правую клавишу режима, чтобы отправить событие двойного нажатия на телефон, ноправый не работает. Однако левый работает. Честно говоря, я не знаю почему. Двойной тап по экрану не работает ... В любом случае, JavaScript не нужен.