弹出窗口和 aria-live 的可访问性问题

Question

我有一条错误消息，我正在使用 aria-live = 礼貌。 这是宣布第一次出现错误。 第二次它再次宣布我是否在同一页面上打开一个弹出窗口并且该页面发生错误。

<div aria-live="polite">
<error-message-component></error-message-component>
</div>

我无法找到它发生的原因，因为它已经向用户宣布并且弹出窗口背后的内容有 aria-hidden="true"

Answer 1

所以问题是错误消息（aria-live）被宣布了两次？预计第一次，但如果您打开一个弹出窗口，它会宣布第二次？

如果您仅指定aria-live="polite"并且不指定aria-relevant，那么这意味着在您更改文本时应该宣布 aria-live 区域（添加、删除或更改文本）在

（或其任何子 DOM 元素）中，或者如果您添加子 DOM 元素（但不是 remove 子 DOM 元素)。

因此，您应该确认当您显示弹出窗口时，没有子 DOM 节点被添加到您的 aria-live 区域，并且 aria-live 区域内的任何文本都没有更改。

还要检查 aria-live 区域是否被您的弹出窗口以某种方式引用。如果您的弹出窗口中有 aria-labelledby 或 aria-describedby 指向 aria-live 区域，则 aria-live 区域将作为弹出窗口的一部分宣布。