代码之家 › 专栏 › 技术社区 › Nitesh Rana

出现多个错误时的可访问性

wai-aria css html javascript

Nitesh Rana · 技术社区 · 7 年前

我有一个叫做误差分量的角分量。每次服务抛出错误时,它都会被初始化。现在,当有一个错误时,只有屏幕阅读器读取错误,但在多个错误的情况下,屏幕阅读器只读取一个错误,这是最后一个错误。

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

因此,当出现一个错误时,屏幕阅读器将读取它,但当出现多个错误时,屏幕阅读器只读取第一个错误。

1 回复 | 直到 7 年前

slugolicious 7 年前

我在回答你的问题的开头提到了这一点 previous question 关于指定 role="alert" 和 aria-live="polite" .

您的代码示例正在指定冲突信息。使用role=“alert”会给您一个隐含的aria live=“assertive”,但您也指定aria live=“politive”。我建议删除role=“alert”。有aria live=“礼貌”就足够了。

spec 对于断言说:

五月

因此,如果您有多个断言消息,那么前面的断言消息可以

如果您发出错误消息aria live=“polite”,那么您可以听到所有消息。这取决于页面何时刷新以及屏幕阅读器缓冲区何时更新。如果您在中更新消息 <error-component> ,屏幕读取器缓冲区更新,然后更新中的消息 <错误组件> 当用户的交互暂停时,应该读取排队的错误消息。不过,这可能是个时间问题。

当您有多个错误消息时会发生什么?你能同时看到所有的信息吗?或者你只是看到一条信息然后被下一条信息覆盖?

如果创建多个视觉 <错误组件> 元素,以便您可以同时查看所有消息以及您将这些组件的容器设置为aria live=“politive”,然后您将听到所有错误。