Question

我需要验证输入 - 如果它是空的，则在其下方显示文本，在右侧显示星号。因此，标签应该在不同的容器中并且具有不同的文本。下面的代码有效，直到您输入内容并擦除，它将显示两个完全相同的标签。有没有办法创建单独的标签？

标记。

<div class='wrapper'>
  <input type='text' class='image-name' />
</div>

<input type='submit' />

JS

  var validator = $('form').validate({
    errorPlacement: function (error, element) {
      if (element.attr('class', 'image-name')) {
        error.addClass('b-gallery__validation-message');
        error.insertAfter(element.parent());

        // creating an asterisk 
        var asterisk = error.clone()
          .addClass('b-gallery__validation-star')
          .removeClass('b-gallery__validation-message')
          .text('*');
        asterisk.insertAfter(element);
      }
    }      
  });
  validator.form();

Answer 1

你试图在errorPlacement回调函数中做太多。它只会在验证错误时触发，将消息label放在布局中......对于您还想要做的所有其他事情，它不会被触发。

我建议每个回调函数<{3}}，并相应地重新构建代码。

errorPlacement 用于布局。当元素无效时，此回调函数会告诉 where 将元素放在表单上。在验证元素后默认为。

success 用于在元素有效时控制label。换句话说，默认情况下，元素有效时没有label，因此通过使用此回调，您可以生成一个。通常，人们会使用它在有效元素旁边放置一个图标，如复选标记。

只要存在验证错误，就会触发 highlight ，并且它用于切换正在测试的元素的默认错误和有效类。

每当纠正验证错误并且它用于切换正在测试的元素的默认错误和有效类时，都会触发 unhighlight 。 与highlight完全相反，应在安装highlight时安装。

jQuery验证控件的单独错误标签

1 个答案: