是否有两个标签用于相同的表单控件无效或无法访问HTML？

Question

我使用插件进行客户端表单验证。问题是插件添加了包含表单信息的标签，因此无效表单控件现在有两个标签。我修改了插件，以便标签根据有效性进行切换;但是，我担心可访问性和有效的HTML（尽管不太关心HTML的验证）。

那么，这样可以吗？

<label aria-hidden=true style="display:none" for="inputElement">My Input Element</label>
<label for="inputElement">My Input Element must be at least 10 characters</label>
<input id="inputElement">

我在规范中看到每个标签只能指向一个输入元素，但它没有说明一个输入元素是否只能有一个标签。

感谢。

Answer 1

单个输入有多个标签是不可访问的。使用屏幕阅读器的人很困惑。话虽如此，屏幕阅读器将无法看到display:none;的任何内容。如果您只是根据输入是否有效进行切换，请改为使用div。

对this question的回答解释说这在技术上是正确的，但第二个答案解释了为什么你不这样做。