Html Aria Live="；自信的；不是用下巴读的

大家好，我的社区。这是我的第一个问题，但我会尽量简明扼要

我的任务是更新我们的ASP.NET web应用程序，使其符合第508节的要求。这对我来说都是新鲜事，我很难让事情按预期的方式进行

我们有一个页面，用户通过onmouseover事件获取有关链接的附加信息。显然，这不适用于无视力的用户。因此，我们为他们提供了一个“更多信息”按钮，该按钮显示了视力正常的用户获得的相同的“工具提示”div

我在“tooltip”div中添加了

aria live=“assertive

，因为我知道如果页面加载时该div被隐藏，然后通过按钮显示，那么JAWS就会读取该div。让我沮丧的是，事实并非如此

工具提示div如下所示：

<div id='tooltip' aria-live='assertive' style='display:none;'>
    <span id='tooltip_message'>This is my tooltip text</span>
</div>

<button id='ttBtn' onclick="ShowToolTip('tooltip'); return false;">
    More information
</button>

显示工具提示div的按钮如下所示：

<div id='tooltip' aria-live='assertive' style='display:none;'>
    <span id='tooltip_message'>This is my tooltip text</span>
</div>

<button id='ttBtn' onclick="ShowToolTip('tooltip'); return false;">
    More information
</button>

标记：

<button id="tooltip1_508KeyboardButton" class="hidden" onclick="ShowToolTip('tooltip1'); return false;" onblur="CloseToolTip('tooltip1');">Click for overview</button>

<div id='tooltip1_ToolTipContainer' aria-live='polite' aria-atomic='true'>
    <div id='tooltip1_ToolTip' class='section tooltip' style='display:none;'>
        <span id='tooltip1_Msg'>This is my tooltip's text.</span>
   </div>
</div>

点击查看概览
这是我的工具提示文本。

---

我希望这对将来的某个人有用。我想，我可以很容易地在屏幕外的某个地方放置一个aria live区域，当工具提示“显示”时，该区域会更改文本。因此，有很多方法可以剥下这只猫的皮。

作为一个快速破解，以下内容似乎对我使用IE11+JAWS 15很有用

function ShowTooltip(ttID)
{
  setTimeout(function(){
    $('#' + ttID).css('display', 'block');
  }, 100)
}

您也可以尝试以下方法：

• 将工具提示文本推送到始终处于活动状态的aria live区域
• 动态地将用户的注意力转移到工具提示上。（不过，我会非常小心，这可能会让用户感到困惑。）

---

我们使用了一种与您的第一个项目符号非常相似的解决方案。但我们仍然使用JavaScript隐藏/显示该区域。诀窍是删除包含该消息的范围，然后将其添加回。这使该区域能够正确读取。我通过查看Freedom Scientific页面的源代码发现了此解决方案，该页面显示了一条每10秒挂起一次。他们正在删除旧邮件并创建新邮件。为了避免不必要的步骤，我们先克隆邮件，然后删除旧邮件，然后再添加回克隆。