html - JAWS 不读取带有 aria-label 的 header 内 span 的 aria-label

我有一个跨度，用作标题内的按钮:

<h3 aria-label="Header Aria Label">
  <span tabindex="0" aria-label="Span Aria Label">Button</span>
</h3>

但是，每当我选择跨度时，它都会显示“Header Aria Label”。如何强制 JAWS 读取跨度中的 aria-label？

最佳答案

首先，请不要被冒犯，但您所做的是糟糕的设计，至少在可访问性方面。
标题中的按钮(不是标题，顺便说一句，在 HTML 5 中有一个单独的 <header> 元素，它与您在此处使用的 <h3> 元素完全不同)是一个坏主意。真的。
但无论如何，如果您希望 JAWS 将您的 span 视为按钮，则可以:

使用原生 <button> 元素，或

在您的 role="button" 上使用 span ，否则 JAWS 不会以任何方式知道这个特定的 span 应该被视为一个按钮。但是请选择第一种方法，除非您绝对必须在此处使用 span。请把它从你的 h3 中拉出来，这将更容易访问。

关于html - JAWS 不读取带有 aria-label 的 header 内 span 的 aria-label，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/40984037/