我试图弄清楚当焦点位于输入元素上时如何使对讲/画外音宣布图例。大白鲨读了这个传说。唯一的问题是对讲/画外音。我知道当焦点移动时，屏幕阅读器会读取焦点下的元素。如果是这样的话，那么不确定 Jaws 在桌面上的表现如何。我尝试了 aria-labelledby ，但我必须在很多地方添加，而且它将该区域视为不符合预期的区域。
setTimeout(() => document.getElementById('f1').focus(), 3000);<!doctype html>
<html lang="en-US">
<body>
<form name="form1">
<fieldset class="address" name="billto">
<legend>Billing Address</legend>
<section>
<label for="f1">Street</label>
<input id="f1" name="street">
<br>
<label for="f2">City</label>
<input id="f2" name="city">
<br>
<label for="f3">State</label>
<input id="f3" name="state">
<br>
<label for="f4">Zip code</label>
<input id="f4" name="zipcode">
<br>
</section>
</fieldset>
</form>
</body>
</html>最佳答案
如果您的代码在语义上是正确的，那么您不必执行任何操作。让各个屏幕阅读器按照他们认为合适的方式处理它。在您的简单代码示例中，使用 iOS 上的 VoiceOver(我没有 Mac 来尝试)，当我向右滑动时，我的 VO 焦点转到“帐单地址”边框，并宣布为“帐单地址，表单开始” ”。我不会听到<legend>如果我滑动到任何输入字段。
使用 NVDA，如果我在 DOM 中向下箭头(类似于使用 VoiceOver 向右滑动)，我会听到“分组，帐单地址”。如果我 tab 到输入字段而不是向下箭头，从而跳过 <legend>文本，文本仍然在宣布第一个字段之前宣布，“帐单地址、分组、街道编辑已自动完成空白”。
所以它似乎工作正常。如果对讲不能正确播报，则说明对讲存在错误。
关于html - 当专注于某个项目时，对讲/画外音不会读取 <legend>，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/68551175/