如何以一种可访问性友好的方式隐藏 jQuery Mobile 表单中的标签标签？

Question

我想在我的 jQuery Mobile 应用程序的表单输入标签中隐藏标签标签，并仅依靠占位符属性来描述特定输入的用途。

但是，屏幕阅读器依靠标签来描述特定的表单输入元素的用途。它们不依赖占位符属性。

如何在表单中隐藏标签标签，同时可靠地允许屏幕阅读器阅读它们？

Answer 1

JQM 通过一个类来做到这一点。只需像这样将 ui-hidden-accessible 添加到您的标签标签中

<label for="username" class="ui-hidden-accessible">Username:</label>
<input type="text" name="username" id="username" value="" placeholder="Username"/>

Answer 2

您还可以像这样隐藏字段容器（例如 DIV）内的所有标签

<div data-role="fieldcontain" class="ui-hide-label">
    <label for="username">Username:</label>
    <input type="text" name="username" id="username" value="" placeholder="Username"/>
</div>

请参阅jQuery Mobile documentation。