如何防止JAWS在必填字段上说"无效输入"?

cra*_*tik 12 forms html5 accessibility screen-readers jaws-screen-reader

当使用HTML5属性来标记具有必填字段的表单时,Firefox中的JAWS 14(以及可能的其他人)在用户第一次关注它们时(即用户第一次遇到该字段时)将空字段宣布为"无效条目".

<input type="text" required value="">
Run Code Online (Sandbox Code Playgroud)

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

  1. 你怎么能绕过"无效录入"公告?
  2. 为什么JAWS会这样做?
    如果用户跳过它(将其留空,因此无效),我会理解将字段描述为"无效",然后再次关注它.当前的实现令人困惑,因为用户被告知他们在他们甚至不知道存在的字段中输入了错误.

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

cfn*_*erd 2

仅供参考...这是 JAWS 13/14 和其他屏幕阅读器中的一个已知问题,如本文所述: 可访问表单 2:必填字段和额外信息

\n\n
\n

当使用 JAWS 13/14、NVDA 2012.3 和 WindowsEyes 8.1 与 Firefox 20\n(可能还有其他一些浏览器)时,会为每个必需的表单字段显示 HTML5 \xe2\x80\x98invalid Entry\xe2\x80\x99 消息\n在浏览模式下用箭头浏览表单\n或在表单模式下从一个输入切换到另一个输入。由于此警告在输入之前出现,因此可能会让某些用户感到困惑。

\n
\n\n

现在,您可以将requiredandaria-required与占位符一起使用。

\n\n
<label for="theInput">Label Text (required):</label>\n<input type="text" name="theInput" id="theInput" required="required" aria-required="true" placeholder="the Input" value="" /> \n
Run Code Online (Sandbox Code Playgroud)\n