ARIA - 跳过阅读屏幕阅读器中的输入值 (NVDA/Windows)

Question

我正在尝试找到一种方法，让屏幕阅读器（如 Windows Narrator 的 NVDA）停止读取输入值，而只读取 aria-describedby。

在这种情况下，我有一个 Web 组件，它是一个掩码输入字段。假设它配置了一个设置为(___) ___-____ 的电话掩码，其中下划线只能是数字。现在屏幕阅读器会读取left parens, 3 lines, right parens, space... 等等，然后读取我设置为aria-describedby 的值，类似于“电话号码，1231231234”，它使用我组件的未屏蔽值。

我想要的是，屏幕阅读器只说“电话号码，1231231234”，这是我的aria-describedby 值并跳过其余部分，因此它保持简短并避免说出可能使受损用户感到困惑的话..

一点背景知识，也许这可以改变一点响应，我的组件是用 Aurelia 构建的，我正在利用绑定系统来更新值。

这可能吗？我有几个选择？我完全偏离了我想要实现的目标吗？

谢谢！

Answer 1

您无法通过这种方法来保持可访问性。屏幕阅读器读出输入字段的内容是非常重要的，否则当用户输入一个数字时，它不会告诉他们这个数字是什么——即使他们决定返回一个字符或转发一个字符， value 将读取标签而不是他们输入的内容。我想您正在使用的输入掩码是使用 javascript 来用用户在按键上提交的掩码字符替换掩码字符？

通常最佳做法是在标签或与标签关联的描述性文本中概述所需的输入格式。这将允许视力正常的用户轻松匹配所需的格式，并允许视力障碍用户使用他们的键盘导航输入值，同时完全了解所需的格式是什么。我整理了一个简单的例子。

<label for="textInput">Phone Number</label>
<span id="phoneDesc">Please use the following format: (xxx)xxx-xxxx</span>
<input id="textInput" type="text" aria-describedby="phoneDesc" />

了解输入掩码的一般可用性也可能会有所帮助 - 很多人往往会觉得它们很麻烦。 https://www.nngroup.com/articles/stop-password-masking/

如果您决定使用它们并且不介意与基于“线”的方法不同的方法，也许可以尝试一下politespace（我没有尝试过，但它可能值得根据您的需求进行评估） https://github.com/filamentgroup/politespace