gpt4 book ai didi

html - 可访问的错误消息

转载 作者:行者123 更新时间:2023-11-28 03:51:49 24 4
gpt4 key购买 nike

在我的应用程序中,很少有在模糊时触发的字段验证。错误消息容器用具有 role=alert 的 DIV 包装。因此,当用户输入无效输入然后按 Tab 键时,屏幕阅读器会向用户宣布错误消息,但这会切断用户当前正在阅读的标签和相关信息。

此场景已被确定为可访问性问题。解决此问题的任何帮助都会非常有帮助。

示例标记如下。

<label class="label" for="view-184">Payment amount</label>
<input id="view-184" type="text" autocomplete="off" placeholder="Please enter a dollar value" aria-describedby="form-input-text-error-view166-required">

<div class="error" role="alert" aria-live="polite" style="">
<span id="form-input-text-error-view166-custom-format" class="error-custom-format" style="display: none;">Enter a valid dollar value</span>
<span id="form-input-text-error-view166-required" class="error-required">Dollar value is required.</span>

</div>

最佳答案

我遇到了无障碍顾问并得到了答案。他的回答是我们不需要为在模糊/更改时触发的错误消息添加 role="alert"。我们所要做的就是当用户单击提交按钮时,将焦点放在第一个无效字段上。我们还可以使用 aria-describedby 标签将字段与错误消息链接起来。

关于html - 可访问的错误消息,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26726541/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com