VoiceOver 不会对锚点做出反应，也不会正确改变对 iOS 的关注

Question

我以前也问过这样的问题，但在找到解决方法之前，我无法安心：

iOS 上的 VoiceOver 是我遇到的唯一一个似乎无法element.focus()正确处理锚点和 JavaScript功能的屏幕阅读器。

查看我的博客。在那里你会看到经典的skip to content-link 和一个scroll to top-button。该链接是一个常规锚点，其目标是具有 id 的 div main。该按钮会触发动画，但由于这对盲人没有理想的效果，我还让它将焦点移到了skip to content链接上。在 VoiceOver 开启时双击上述任一控件。焦点不会移动。我在 Safari、Firefox、Google Chrome 和 iSource 的 iOS 应用程序中对此进行了测试。

现在转到任何其他设备，无论是 android 手机还是 windows 计算机。打开屏幕阅读器。据我所知，它始终有效（使用 Microsoft Edge、Google Chrome 和 Internet Explorer 进行测试）。

锚点的 HTML：

<a href="#main" id="top-link">Skip to content</a>
<!-- ... -->
<div id="main" role="main">
<!-- ... -->
</div>

按钮的 JS： document.getElementById('scroll-to-top').addEventListener('click', function() { document.getElementById('top-link').focus(); });

没什么好看的吧？不，tabindex="-1"在主 div 上不能解决我的锚点问题。有效的是，如果锚点引用一个链接，但其中必须有一些可见的文本，例如

<a id="anchorTarget">&nbsp;</a>

不起作用。有没有人偶然发现一个好的、可靠的解决方法，或者我将不得不接受这样一个事实，即我的锚点/JavaScript 焦点更改对 iOS 上的 VoiceOver 用户没有任何作用？

Answer 1

这是iOS 上的一个已知问题。有一个博客有一些hacky解决方案，但真正的责任在于Apple来解决这个问题。