加载页面时，可访问性aria-live无法正常工作

Question

我试图让我的屏幕阅读器在页面加载消息时阅读消息。 下面是我使用的代码。 当我将鼠标悬停在文本上时，我可以阅读该消息。 但是，由于某种原因，我无法让屏幕阅读器读取页面加载时的消息。 请提出我是否需要做的事情。

<div class="bannerError">
    <div class="bannerError_image"></div>
    <span class="bannerError_text" aria-live="assertive">Please enter your name
    </span>
</div>

Answer 1

活动区域容器在页面加载时必须存在于HTML中，但是最初不应包含任何内容。

仅在页面加载后，才会监视活动区域的内容以进行更新。 通常，通过JavaScript将内容添加到实时区域。

您可能想看看咏叹调实时使用的WCAG页面： W3C-使用ARIA role = alert或实时区域来识别错误

此外，Terril Thompson的现场区域测试页面也非常不错，该页面说明了实现aria-live的一些不同方式。