aria-expanded 仅用于 "click" 交互，还是也可以用于 "focus" 交互？

Is aria-expanded only for "click" interaction, or can it be used for "focus" as well?

我可以在具有焦点或悬停状态的 link 元素（锚点）上使用“aria-expanded”吗？因此，当用户在 link 上使用键盘悬停或聚焦时，aria-expanded 应变为 true，而当悬停或聚焦被移除时，它应变为 false。

根据我的阅读，除了这个 link，我真的找不到明确的答案，它说它应该只在点击时使用，而不是在焦点上使用。

您在一个元素上使用 aria-expanded 'expands' 另一个项目，例如弹出式菜单或手风琴。

它不适合显示某物是否被聚焦/悬停，它是为获得 'activated' 的东西设计的（因此 button 是正常用例，link <a> 有时是可以接受的，如果您将它用作 no JavaScript 的后备）。

在您给出的示例中，不清楚您是在悬停时还是在焦点上显示子菜单，这就是您要使用 aria-expanded.

的原因

如果你不是 那么不，不要使用 aria-expanded。

如果您是，我建议您更改菜单，这样当您单击它时，菜单会保持打开状态（对于触摸设备，无论如何您都应该这样做），此时aria-expanded 适合点击。

在上面的示例中，屏幕 reader 会在您第一次遇到它时宣布当前状态为 collapsed，因此预期的行为是按 space 或输入和它将状态更改为 aria-expanded="true" 并宣布 expanded 让用户知道他们已经透露了一些附加信息（激活后应该是下一个制表位）。

您仍然可以让菜单向悬停鼠标的用户显示。

我希望这是有道理的。

WCAG 3.2.1 明确指出元素不能在焦点上改变。应允许键盘和屏幕 reader 用户在获得焦点时打开和关闭元素。无论是否以焦点打开，aria-expanded 都用于提醒屏幕 reader 用户一个元素（包括锚标记）将在触发时紧随该元素展开内容。

aria-expanded 指示元素或其控制的另一个分组元素当前是展开还是折叠。 [...] 这可以应用于页面部分以标记可灵活管理内容密度的可扩展和可折叠区域。

您可以将 aria-expanded 应用到 link，但如果按下 link 会触发一个动作但不会更改浏览器焦点或页面位置，建议作者考虑使用按钮角色而不是 link 角色。