jquery - jQuery Validation - 如何让生成的错误标签出现在 div 的末尾

Question

我有这样的情况：

<div>
  <label>Text</label>
  <input type="text" id="email">
  <label>Text</label>
  <input type="text" id="name">
</div>

使用 jQuery 验证库（使用所有默认值进行验证），将生成电子邮件“错误”标签，如下所示：

<div>
  <label>Text</label>
  <input type="text" id="email">
  <label>ERROR:|</label>
  <label>Text</label>
  <input type="text" id="name">
</div>

但我的目标是像这样得到它：

<div>
  <label>Text</label>
  <input type="text" id="email">
  <label>Text</label>
  <input type="text" id="name">
  <label>ERROR:|</label>
</div>

我该怎么做呢？

jQuery 验证库

编辑： 我只是在 invalidHandler 事件中附加标签时遇到的问题是，在 invalidHandler 事件之后才生成标签。

Answer 1

验证库中有一个 errorPlacement 函数。

$('.inputForm').validate({
   ... settings ....
   errorPlacement: function(error, element) {
      error.appendTo(element.parent());
   },
   ... other settings ...
});

Answer 2

只需为您的主 Div 分配一个 Id，然后将错误附加到该 Div。例如

$("div#divid").append("error");

Answer 3

jQuery Validation Plugin 将始终预先添加错误标签，除非您先添加自己的标签。所以...

<div>
 <label>Text</label>
 <input type="text" id="email">
 <label class="error" style="display:none"></label>

 <label>Text</label>
 <input type="text" id="name">
 <label class="error" style="display:none"></label>
</div>

确保将类设置为与插件使用的相同，并默认隐藏元素。