7

我在一个 div 中有一组按钮，并带有一些 javascript 在它们之间移动焦点以响应箭头键事件。

当我使用 NVDA/Firefox/Windows 进行测试时，似乎 NVDA 会覆盖我的箭头键处理程序并根据自己的规则移动焦点。这是一个问题，因为我的小部件是高度可定制的、动态的和响应式的——所以移动焦点的规则非常复杂。

Voiceover 和 ChromeVox 都没有这种行为。

我注意到向每个按钮添加 role="gridcell" 似乎可以解决此问题，但我不想这样做，因为这意味着屏幕阅读器不会将我的按钮视为按钮。我也真的不想更改 html 结构（例如，将每个按钮包装在另一个元素中），除非它是绝对必要的。

有没有办法（例如 aria 或专有属性）告诉 NVDA 不要将自己的箭头键行为应用于按钮？

4

2 回答 2

6

考虑通过覆盖用户的预期行为，您冒着创建完全无法使用甚至无法访问的界面的风险。

我强烈建议不要尝试这样做。

无论如何，您添加的任何 ARIA 尝试覆盖它都会影响非 NVDA 用户。NVDA 拦截箭头键，因此在 NVDA 对箭头键做出反应之前，JavaScript 无法执行。

请注意，NVDA 用户已经可以使用b和Shift+在按钮之间导航b，因此他们不需要依赖Tab.

现在，尽管如此，您可能会发现一个与您在WAI-ARIA Authoring Practices中尝试实现的模式相似的现有模式。

如果您可以概述您的目标并可能展示一个示例，那么我可以确定一些现有的模式或技术，这些模式或技术将使您能够实现目标而不会冒着破坏体验的风险。

于 2017-01-05T03:20:12.213 回答
4

如果您的所有按钮都在一个容器（span 或 div）中，您可以将 role=application 添加到容器中，这将强制所有键盘事件转到您的应用程序而不是辅助技术。不过，Role=application 应该非常谨慎地使用。

<div role=application>
   <button>alpha</button><br>
   <button>beta</button><br>
   <button>gamma</button><br>
</div>
于 2017-01-07T15:55:59.277 回答