Windows 10 Edge 上的 NVDA 不读取动态更新的消息答案

【问题标题】：NVDA on Windows 10 Edge does not read dynamically updated messagesWindows 10 Edge 上的 NVDA 不读取动态更新的消息
【发布时间】：2020-05-01 20:16:19
【问题描述】：

我的网站上有一个动态更新的通知部分，位于我的 div class='notification'（父 div 始终存在）内。当成功消息出现时，Windows 10 Edge 中的 NVDA 屏幕阅读器不会读取它。我怎样才能让它阅读消息？

<div class="notification">
    <h6 tabindex="0" role="alert" aria-live="polite" aria-busy="true">Changes saved successfully.</h6>
    <button tabindex="1" type="button" data-testid="dismiss-button" aria-label="Dismiss">
       <span class="MuiIconButton-label"><svg class="MuiSvgIcon-root" focusable="false" viewBox="0 0 24 24" aria-hidden="true" role="presentation"><path d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"></path></svg>
       </span>
    </button>
</div>

【问题讨论】：

您使用的是哪个版本的 Edge 浏览器和 NVDA？请检查新版本并更新到最新版本。此外，从 github NVDA 论坛看来，这是know issue，您可以尝试在对话框内的节点上使用 role="document"。如果仍然无法正常工作，您也可以在 NVDA github forum 上发布此问题。

标签： windows-10 microsoft-edge nvda

【解决方案1】：

尝试做这样的事情：

<div class="notification" aria-labelledby="my-message">
    <h6 id="my-message" tabindex="0" role="alert" aria-live="polite" aria-busy="true">Changes saved successfully.</h6>
    <button tabindex="1" type="button" data-testid="dismiss-button" aria-label="Dismiss">
       <span class="MuiIconButton-label"><svg class="MuiSvgIcon-root" focusable="false" viewBox="0 0 24 24" aria-hidden="true" role="presentation"><path d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"></path></svg>
       </span>
    </button>
</div>

【讨论】：