jQuery 验证，如何将错误消息连接到 div

【问题标题】：jQuery validation, how to hook error message up to divjQuery 验证，如何将错误消息连接到 div
【发布时间】：2017-10-26 15:08:23
【问题描述】：

我添加了一个 jQuery 验证规则，因此必须至少选中一个“require-one”类复选框才能验证表单。

$(".require-one").rules("add", {
  required: true,
  minlength: 1,
  messages: {
    required: "Check at least one"
  }
});

效果很好，表单没有提交，焦点设置在第一个复选框。

但是我如何让它显示错误消息：

<span id="require-one-errormessage></span>

提前致谢

【问题讨论】：

标题显示div，但OP显示span。
你的.validate()方法和相关的HTML在哪里？

标签： javascript jquery jquery-validate

【解决方案1】：

您可以在.validate() 方法中使用the errorElement option 将默认的label 元素更改为任何内容。

$('#myForm').validate({
    errorElement: "span",
    // your other options
});

然后您可以使用the errorPlacement option 将元素放置在您的布局中。使用条件来放置一种类型与另一种类型。

$('#myForm').validate({
    errorElement: "span",
    errorPlacement: function(error, element) {
        if ($(element).is(':checkbox')) {
            error.insertBefore(element); // custom
        } else {
            error.insertAfter(element);  // default
        }
    },
    // your other options
});

AFAIK，因为错误元素是由插件动态创建和切换的，所以无法分配id，也没有任何意义。但是，如果需要，您可以使用 the errorClass option 为所有错误消息分配不同的类。

【讨论】：