我可以aria-expanded在具有焦点或悬停状态的链接元素（锚点）上使用“”吗？因此，当用户在链接上使用键盘悬停或聚焦时，aria-expanded 应该变为 true，而当悬停或焦点被移除时，它应该变为 false。
根据我的阅读，我真的找不到明确的答案，除了这个链接，它说它应该只用于点击，而不是焦点。
问问题
2060 次
3 回答
3
您aria-expanded在“扩展”另一个项目的元素上使用，例如弹出菜单或手风琴。
它不适合显示某些东西是否被聚焦/悬停，它是为“激活”的东西而设计的（所以 abutton是正常的用例，<a>如果您将链接用作没有 JavaScript 的后备，则有时可以接受） .
在您给出的示例中，不清楚您是否在悬停或焦点上显示子菜单，这就是您要使用aria-expanded.
如果你不是，那么不，不要使用aria-expanded.
如果您是，我建议您更改菜单，以便在单击它时使菜单保持打开状态（对于触摸设备，无论如何您都应该这样做），此时aria-expanded单击是合适的。
在上面的例子中，屏幕阅读器会在你第一次遇到它时宣布当前状态为焦点collapsed，所以预期的行为是按空格键或回车键，它将状态更改为aria-expanded="true"并宣布expanded让用户知道他们已经透露了一些额外的信息（这应该是激活后的下一个制表位）。
您仍然可以让菜单显示给使用鼠标悬停的用户。
我希望这是有道理的。
于 2019-12-06T11:25:36.840 回答
2
WCAG 3.2.1 清楚地表明元素不能在焦点上改变。应允许键盘和屏幕阅读器用户在获得焦点时打开和关闭元素。无论它是否以焦点打开，aria-expanded 都用于提醒屏幕阅读器用户一个元素（包括锚标签）将在触发时立即扩展该元素之后的内容。
于 2019-12-10T14:40:36.230 回答
1
aria-expanded 指示元素或它控制的另一个分组元素当前是展开还是折叠。[...] 这可以应用于页面部分，以标记可灵活管理内容密度的可扩展和可折叠区域。
您可以将 aria-expanded 应用于链接，但如果按下链接会触发操作但不会更改浏览器焦点或页面位置，建议作者考虑使用按钮角色而不是链接角色。
资料来源：https ://www.w3.org/TR/wai-aria-1.1/#aria-expanded和https://www.w3.org/TR/wai-aria-1.1/#link
于 2019-12-17T01:46:02.283 回答