让 JAWS 宣布 aria-selected 状态

Question

我有一个带有选项卡式导航的页面，我需要让 JAWS 宣布选项卡状态。例如：

      ________
 Shop | Cart | Recent orders | Profile
--------------------------------------

当用户在上述选项卡中移动时，JAWS 应该说类似

的内容

Shop tab; not selected
(Tab)
Cart; selected
(Tab)
Recent orders; not selected
(Tab)
Profile; not selected

在上面的括号中有“(Tab)”的地方，我的意思是 JAWS 说的是 "tab" 这个词，因为 Tab 键被按下以在两者之间移动导航标签。

目前，JAWS 不会说 "not selected" 和 "selected" 两个词，但其他词会说。我正在使用

这样的标记

<a aria-selected="false" href="profile.html" id="profileTab">

官方 JAWS 文档（在线复制 here）表明 JAWS 识别 aria-selected 但没有说明属性有什么作用。

我可以在我的页面源代码中看到 ARIA 标记，但据我所知，JAWS 不会大声朗读它，也不会对其进行任何操作。我怎样才能让 JAWS 说 "selected" 和 "not selected"（或类似的东西）？

Answer 1

authoring practice has a good section on the tab control. The demo site 正在像您一样使用 aria-selected，但当我刚才测试它时，它在 JAWS 和 Internet Explorer 上听起来不错，尽管演示是在 aria-selected <button> 而不是 link.

您使用的是什么浏览器？
最新版本的 JAWS？

此外，选项卡控件通常使用箭头键在选项卡之间导航（参见前面提到的 "authoring practice"）而不是 tab 键，但这不应该影响aria-selected是否被读取

（作为一个有趣的事实，您可以在每次按下 tab 键时关闭 JAWS 的 "tab" 通知。我经常使用 JAWS，并且不当我按下 tab 键时不需要它告诉我。这只是音频混乱（对我来说）。Ins+J > Utilities > Settings Center > Manage Key Labels > Tab > Toggle Mute)

更新不好意思，一时脑子出问题了。我忘了提 role="tab"。这就是导致您出现问题的原因。 aria-selected 在 role="button" 或 role="link" 上无效，但在 role="tab" 上有效。参见“Allowed ARIA roles, states and properties”

将代码更改为

<a aria-selected="true" href="profile.html" id="profileTab" role="tab">

它应该可以工作。

让 JAWS 宣布 aria-selected 状态

Making JAWS announce aria-selected status

html

accessibility

wai-aria

jaws-screen-reader

section508