Question

我目前正在使用jQuery验证脚本（http://jqueryvalidation.org/）来验证表单输入。但是，我不喜欢错误消息显示在我的输入元素旁边。我宁愿在我的输入元素中显示它们作为占位符。

这意味着，例如，当一个字段留空时，错误消息＆＃34;此字段是必需的。＆＃34;未出现在＆＃34;错误＆＃34;中的输入元素旁边class，但作为输入元素内的占位符。

我似乎无法弄清楚如何使这项工作。任何建议都将不胜感激。

Answer 1

当不支持占位符时，通常使用位置绝对的标签来覆盖输入并隐藏onfocus。可以将相同的逻辑应用于错误消息，同时保持可访问性而不依赖于占位符属性。封闭的div应该是内联的，因此错误文本与输入宽度保持内联。

<div style="position:relative;display:inline;">
  <input type="text">
  <span style="position:absolute;top:0;left:0;">My error message</span>
</div>