我的页面有两个注册用户的步骤。
用户填写完第一部分的所有字段后，需要确认“条款和条件”，然后按一个按钮进行确认。 在他按下按钮后，第一部分变为只读，第二部分（要填写的更多字段）出现在页面底部，页面滚动到这个新部分。
我需要通知屏幕阅读器在同一页面上有一个新部分，但我不知道我可以告诉谁。
感谢您的帮助！
【问题讨论】：
标签： html accessibility transition scrollto wai-aria
在你的 html 中有一个空的 span/div 和 aria-live="assertive"。在您的按钮单击功能中，将您希望读者宣布的文本添加到该范围内。
（这与您将关注该部分的功能相同。）
别忘了在函数外清空它，以便下次也能正确宣布。
Aria-assertive 文本将在每次更改时公布。
例如。 在 HTML 中
<span id="announce" aria-live="assertive"></span>
<button id="btn">Click</button>
在 JavaScript 中
$("#btn").click(function(){
$("#announce").text("Scrolled to a new section");
});
【讨论】：
这是关于焦点管理的。您需要在某个地方锚定对用户有意义的焦点，然后您需要移动该焦点。
总体而言，这不是一个理想的解决方案，但缺乏更大目标的背景信息，我将为您提供一些信息，以使这部分功能/有用。
首先，添加此样式，以便您可以看到焦点的位置（您可以稍后删除/更改它）：
*:focus {
outline: 2px solid #f00;
}
现在，当您浏览页面时，您可以看到焦点所在的位置。
然后在您创建新表单的脚本中（我建议您实际上只是隐藏此部分并显示它而不是通过 JS 编写它，但我知道这可能是一个演示），将<h3> 更新为通过添加id 属性和tabindex 来获得焦点，这样您就可以将焦点放在它上面。我使用您已经拥有的<h3>，因为它为用户提供了上下文，并且在这种情况下，我对在非交互式元素上使用tabindex 的普遍厌恶。
<h3 id="second" tabindex="0">
然后在 setTimeout() 之后添加一些脚本，将焦点移动到该元素（从而确保它已被渲染并可以接收焦点）：
var secondForm = document.getElementById('second');
secondForm.focus();
现在，当您单击“继续！”时按钮，页面滚动，标题将获得焦点，被宣布（您可以添加说明文本等），用户可以继续。
您可能需要稍微修改一下脚本，也许将其填充到自己的计时器函数中，以确保它只在您需要时触发，但总体而言，一般概念就在那里。
【讨论】：
tabindex="-1" 将元素保持在自然跳位顺序之外。