更改Jquery验证程序错误位置会使其多次显示错误

由于某些原因，当我更改错误消息的位置时，它会多次显示错误

当我单击submit按钮时，甚至当我单击正文上的其他地方时，它都会给出错误消息

它不会用适当的消息替换错误消息，而是在下面添加新的错误消息

IMG供参考：

希望恢复正常功能，但仍然更改错误位置

HTML:

---

您已经告诉插件将错误消息容器放在

表单

容器之外的某个地方，从而破坏了插件正确切换消息的能力

通过将错误消息移动到

容器中，可以轻松修复此问题

<form role="form" id="avoForm" action="" method="POST">
    <div class="input-group input-group-newsletter">
        <input type="email" id="email" name="email" class="form-control" placeholder="Enter email..." aria-label="Enter email..." aria-describedby="basic-addon">
        <div class="input-group-append">
            <button class="btn btn-secondary" name="avoForm" type="submit">Blast Off!</button>
        </div>
    </div>

    <div id="errorct"></div>
    <!--// dynamic error message will be here - INSIDE FORM //-->

</form>

发射！

演示：

$("#avoForm").validate({
  rules: {
  email: {
    required: true,
    email: true,
    maxlength: 30
  }
},
errorPlacement: function(error, element) {
   if (element.attr("name") == "email") {
     error.insertAfter("#errorct");
   } else {
     error.insertAfter(element);
   }
 }
});

<form role="form" id="avoForm" action="" method="POST">
    <div class="input-group input-group-newsletter">
        <input type="email" id="email" name="email" class="form-control" placeholder="Enter email..." aria-label="Enter email..." aria-describedby="basic-addon">
        <div class="input-group-append">
            <button class="btn btn-secondary" name="avoForm" type="submit">Blast Off!</button>
        </div>
    </div>

    <div id="errorct"></div>
    <!--// dynamic error message will be here - INSIDE FORM //-->

</form>