<legend>标签不被Windows Narrator读取。

Question

Windows Narrator无法读取字段集内的图例标签，同时NVDA和JAWS也能正常读取图例。同时，NVDA和JAWS也能正确读取图例。标记如下。

<fieldset>
    <legend>Description</legend>
    <label>
        <input id="option1"type="radio" value="1">
        Option 1
    </label>                     
    <label>
        <input id="option1" type="radio" value="2">
        Option 2
    </label>
</fieldset>

有没有办法让Narrator读取图例？

Answer 1

支持屏幕阅读器 <legend> 一直以来都是不稳定的，而且要针对某项辅助技术（如Narrator）而不影响其他应用（如NVDA和JAWS）是非常困难的，甚至是不可能的。

然而，你可以尝试更明确地传达上下文。legend 元素中插入视觉上隐藏的文本，在该元素的 label 元素。这将为非视力用户补充不可见的额外信息。技术包括 将内容定位在屏幕外或使用CSS剪贴路径。.

<fieldset>
    <legend>Billing Address:</legend>
    <div>
        <label for="billing_name">
            <span class="visuallyhidden">Billing </span>Name:
        </label><br>
        <input type="text" name="billing_name" id="billing_name">
    </div>
    <div>
        <label for="billing_street">Street:</label><br>
        <input type="text" name="billing_street" id="billing_street">
    </div>
    […]
</fieldset>

还请注意，不同的屏幕阅读器的行为方式有时是不一致的。要让它们的行为都一样并不是不可能的，所以我们必须 "分而治之"，并尝试为所有的人做出合理的调整，即使不是每一次都完美。

根据配置的不同，有些读屏器要么对每个表单元素都读出图例，一次读出，要么很少读出，根本读不出来。为了适应这种情况，可以考虑以下几点。

• 尽可能缩短图例，以适应每次与标签一起阅读的情况。
• 在不朗读图例的情况下，使各个标签具有足够的自明性，而不是在每个标签中重复图例。

https:/www.w3.orgWAItutorialsformsgrouping