使用jQuery验证自定义错误标签放置(对于所有或部分错误)

Question

我想在自定义位置放置一个错误标签(Not All).jQuery提供了这个http://docs.jquery.com/Plugins/Validation/validate#toptions选项,但我找不到任何关于如何放置一个特定错误消息而不更改其余所有内容的默认位置？

请务必检查以下所有答案.有多种解决方案.谢谢大家!

Answer 1

因此,如果您希望所有jQuery Validate错误消息都出现在一个位置,那么您将在该页面上使用 http://docs.jquery.com/Plugins/Validation/validate#toptions(Find errorPlacement)选项.

我注意到这里的一些答案回答一个但不是两个选项.

1)如果您想为所有错误定制自定义位置,可以这样说:

$("#myform").validate({
  errorPlacement: function(error, element) {
     error.appendTo('#errordiv');
   }
});

2)如果要为一个或多个错误标签指定特定位置,可以执行此操作.

errorPlacement: function(error, element) {
    if (element.attr("name") == "email" )
        error.insertAfter(".some-class");
    else if  (element.attr("name") == "phone" )
        error.insertAfter(".some-other-class");
    else
        error.insertAfter(element);
}

Answer 2

实际上没有必要使用任何javascript代码,我发现了一个简单的解决方案.您可以强制JQuery Validate将验证错误放在DOM元素中.

例如,JQuery会生成如下错误:

 <label for="firstname" generated="true" class="error">This field required.</label>

你可以将这个标签dom元素放在你的下一个td块或li元素或任何你想要的空白像这样.

<label for="firstname" generated="true" class="error"></label>

JQuery将找到该空白字段并为您放置错误消息.

只是不要忘记标签元素中的for字段!

Answer 3

这是一个更通用的解决方案,并不特定于OP的HTML结构.

如果您只想在其他位置使用一个特定的错误标签,而其余的仍保留在默认位置,请尝试以下操作...

$("#myform").validate({
  errorPlacement: function(error, element) {
     if (element.attr("name") == "myFieldName") {

       // do whatever you need to place label where you want

         // an example
         error.insertBefore( $("#someOtherPlace") );

         // just another example
         $("#yetAnotherPlace").html( error );  

     } else {

         // the default error placement for the rest
         error.insertAfter(element);

     }
   }
});

errorPlacement:选项的在线文档