是否可以强制屏幕阅读器读取字段集的内部内容？答案

【问题标题】：Is it possible to force a screen reader to read the inner contents of a fieldset?是否可以强制屏幕阅读器读取字段集的内部内容？
【发布时间】：2018-10-29 19:30:58
【问题描述】：

在阅读页面时，Chromevox 和 Voice Over（我没有 JAWS 或 NVDA）似乎会跳过 <fieldset> 的内部元素。在下面的示例 HTML 中，有一个按钮可用于关注 <main id="content" tabindex="-1"> 元素：

<html lang="en">
<head><script>
    function focusOnContent() {
        document.getElementById('content').focus()
    }
</script></head>
<body>
    <button onclick="focusOnContent()">Focus on main</button>
    <main id="content" tabindex="-1">
        <h1>User Sign-up</h1>
        <fieldset>
            <legend>Name</legend>
            <label for="firstname">First</label>
            <input type='text' id='firstname'><br>
            <label for="lastname">Last</label>
            <input type='text' id='lastname'>
        </fieldset>
        <button>Submit</button>
    </main>
</body>
</html>

当点击<main> 元素获得焦点并且屏幕阅读器说：

用户注册、姓名、提交

但是，我希望这样理解

用户注册、姓名、名字、姓氏、提交

删除 <fieldset> 元素可以解决问题，但显然我想保留它，因为它可以解决其他可访问性问题。

【问题讨论】：

标签： html forms accessibility screen-readers fieldset

【解决方案1】：

如果您使用的是语义正确的 html，则不必担心屏幕阅读器如何阅读它。有太多的变化，不同的组合会以不同的方式阅读。

屏幕阅读器有不同的屏幕阅读器（Chromevox、VoiceOver、JAWS、NVDA）、不同的浏览器（Chrome、Safari、Firefox、IE、Edge）、不同的操作系统（Mac、PC、移动）以及屏幕阅读器中的不同详细设置本身。

您不能（也不应该）强制屏幕阅读器以您认为应该阅读的方式阅读某些内容。屏幕阅读器用户非常熟悉他们的设置（特定的浏览器、操作系统、屏幕阅读器和设置），并且知道声音应该如何。

你上面的例子看起来不错。

您在 focus() 的目标上有一个 tabindex="-1"
您正在使用<label> 的for 属性指向其各自的<input> 元素
您有一个 <fieldset> 和一个 <legend> 将元素组合在一起

【讨论】：