当焦点位于单选按钮上时,如何阅读图例文本以及单选按钮标签



我有一个单选按钮,上面有一个。当讲述人焦点位于单选按钮上时,它只读取单选按钮的值。但我希望它读取 也 的文本值。

[代码和 UI 快照] https://i.stack.imgur.com/XWlZ5.png

这是代码

<html>
<body>
<legend class="leg">Read this also</legend>
<label class="c-label">
<input type="radio" name="1" value="2" aria-label="yes" />
<span class="yes">yes</span>
</label>
</body>
</html>

当讲述人焦点位于单选按钮上时,预期读取标记的文本以及单选按钮,即"也阅读此内容是单选按钮未选择单选按钮 1 of 1">

实际输出是,讲述人只是读取单选按钮的值,即"是单选按钮未选择单选按钮 1 of 1">

legend元素不能单独使用,而只能用作fieldset元素的第一个子元素。

fieldset元素可用于对许多相关的表单元素进行分组;legend元素为fieldset提供标签。legend元素的长度应保持简短,因为屏幕阅读器通常会读取fieldset内每个输入元素的长度。

如果表单的目的是让用户确认他/她已阅读某些内容(例如条款和条件(,那么更好的方法是省略fieldsetlegend元素,只使用带有正确label元素的复选框(而不是单选按钮(而不是span元素:

<form>
<!-- possibly other form fields -->
<input type="checkbox" name="readconditions" id="rdcond" value="readconditions" /> 
<label for="rdcond">I have read the terms and conditions</label>
<!-- possibly other form fields, including a submit button -->
</form>

最新更新