Функция JavaScript, не вызываемая при использовании VoiceOver

Question

Я создал и протестировал веб-страницу, которая включает полную поддержку для чтения с экрана. Он отлично работает с VoiceOver для Mac, но когда я попробовал VoiceOver для iOS, я нашел проблему. Когда я дважды нажимаю, чтобы вызвать ссылку, прослушиватель событий click не вызывается. Вместо этого VO просто повторяет aria-label, который я ему дал, и после этого он не объявляет «кнопку». Он работает, когда я отключу VoiceOver, просто нажав на него. Ссылка предназначена для того, чтобы вести себя как кнопка, а не перейти на другую веб-страницу. Является ли это ошибкой VoiceOver или есть проблема с моей разметкой или моим кодом?

document.addEventListener('DOMContentLoaded', function() { 
 
    document.getElementById('link').addEventListener('click', triggerFunction); 
 
}); 
 

 
function triggerFunction() { 
 
    alert('testing'); 
 
}

<a id="link" href="javascript:void(0);" role="button" aria-label="My Trigger">Trigger Function</a>

Answer 1

Для прошивки, там явно не мыши, поэтому вы не можете click, но то, что вы можете сделать, это слушать для touch события.

document.addEventListener('DOMContentLoaded', function() { 
    document.getElementById('link').addEventListener('click', triggerFunction); 
    document.getElementById('link').addEventListener('touchstart', triggerFunction); 
}); 

Answer 2

Является ли ваш элемент ссылки вложенным в другой элемент? Иногда событие нажатия VoiceOver будет действовать именно на них, а не впадает в вложенные элементы.

Так, например, если ваш HTML выглядит следующим образом:

<li id="parent"> 
    <div id="link" onclick="myFunction()"> 
    </div> 
</li> 

затем попытайтесь переместить ваш обработчик щелчка на уровень вверх к родительскому элементу.