Question

当我们需要显示错误时（发生错误时，某些元素会添加到DOM中），有一个很好且值得信赖的example for aria-describedby，它变成了：

<p><label for="email">Email address: [*]</label> 
<input type="text" name="email" id="email" aria-describedby="err_1" class="error"> <span class="errtext" id="err_1">Error: Input data missing</span></p>

代替

<p><label for="email">Email address: [*]</label> 
<input type="text" name="email" id="email"> </p>

从可访问性的角度来看还好吗，如果默认情况下错误文本为空？结果，当发生错误时，只会添加其文本。

默认情况下（无错误文本）-此代码看起来正确吗？

<p><label for="email">Email address: [*]</label> 
<input type="text" name="email" id="email" aria-describedby="err_1" class="error"> <span class="errtext" id="err_1"></span></p>

因此我们将span中的唯一文本从空白更改为某些文本。

Answer 1

我的问题是：从可访问性的角度来看，如果默认情况下错误文本为空，是否还可以？结果，当发生错误时，只会添加其文本。

是的。此处讨论：Describing aria-describedby（在读取空元素时可能会导致短暂的暂停）

Answer 2

如果aria-describedby指向的元素为空，则不会读取任何内容，因此您可以。当您将文本添加到<span>时，当用户将焦点后退移至输入时，将读取文本。添加文字后，它会不被阅读。为此，您需要aria-live（这是个好主意）。

<p>
  <label for="email">Email address: [*]</label>
  <input type="text" name="email" id="email" aria-describedby="err_1" class="error">
  <span class="errtext" id="err_1" aria-live="polite"></span>
</p>

aria- describeby但默认情况下为空文本错误-这正确吗？

2 个答案: