Question

当使用HTML5属性标记带有必填字段的表单时，Firefox中的JAWS 14（以及其他可能的其他人）会在用户第一次关注它们时宣布空字段为“无效条目”（即用户第一次遇到字段）。

<input type="text" required value="">

使用aria-required="true"可以避免讨厌的消息（并且JAWS仍然会通知用户该字段是必需的），但是您丢失了HTML5表单验证功能（阻止表单提交，浏览器生成的工具提示以指导用户等））。

如何解决“无效录入”声明？
为什么JAWS这样做？
如果用户跳过它（将其留空，因此无效），我会理解将字段描述为“无效”，然后再次关注它。目前的实施令人困惑，因为用户被告知他们在他们甚至不知道存在的字段中输错了。

我已经阅读过使用JavaScript设置aria-invalid以愚弄JAWS的黑客攻击，但我真的想避免在页面上的每个字段上观察用户交互（focus事件等）有很多输入。目前我使用<label>Label text <span style="display:none;">required field</span></label>，但这是一个非常hacky，非语义的解决方案（更不用说我失去了HTML5 required的好处）。

Answer 1

仅供参考...这是JAWS 13/14及其他屏幕阅读器中的已知问题，如本文所述：Accessible Forms 2: Required Fields and Extra Information。

使用JAWS 13/14，NVDA 2012.3和WindowsEyes 8.1与Firefox 20 （可能还有其他一些浏览器）HTML5'无效条目'消息是在浏览表单时为每个必填表单字段显示在浏览模式下或在表格模式下从输入到输入的标签。以来此警告在输入之前出现某些用户可能会感到困惑。

现在，您可以同时使用required和aria-required以及占位符。

<label for="theInput">Label Text (required):</label>
<input type="text" name="theInput" id="theInput" required="required" aria-required="true" placeholder="the Input" value="" />

Answer 2

“无效条目”是由必需属性引起的。相反，您可以使用aria-required = true。使用此解决方案，您可以摆脱JAWS和NVDA的“无效条目”。

要获取已知问题的完整列表，请在Paciello Group的博客文章中查看此link

如何防止JAWS在必填字段上说“无效输入”？

2 个答案: