JQuery validate добавить класс в элемент ошибки?

У меня есть следующий код с помощью jQuery Validate.

$("#register").validate({
    debug: true,
    errorClass:'error',
    validClass:'success',
    errorElement:'span',
    highlight: function (element, errorClass, validClass) { 
        $(element).parents("div.control-group")
                  .addClass(errorClass)
                  .removeClass(validClass);
    }, 
    unhighlight: function (element, errorClass, validClass) {
        $(element).parents(".error")
                  .removeClass(errorClass)
                  .addClass(validClass); 
    }
});

Есть ли способ добавить класс к элементу errorElement, 'span', чтобы он...:

<span class="help-inline error">Message</span>

Ответ 1

Когда вы указываете errorClass, вам ничего не мешает сделать две вещи: "help-inline error", т.е.:

$("#register").validate({
    debug: true,
    errorClass: 'error help-inline',
    validClass: 'success',
    errorElement: 'span',
    highlight: function(element, errorClass, validClass) {
      $(element).parents("div.control-group").addClass(errorClass).removeClass(validClass);
    },
    unhighlight: function(element, errorClass, validClass) {
      $(element).parents(".error").removeClass(errorClass).addClass(validClass);
    }
});

Обратите внимание, что вам нужно использовать версию 1.10 jQuery Validate для ее поддержки. Более ранние версии допускают только один errorClass.

Ответ 2

$(".error").addClass('help-inline')

добавит класс help-inline ко всем элементам DOM с классом error.

Это то, что вы ищете?

Ответ 3

Альтернатива ответа Ryley, которая не включает "help-inline" в "контрольную группу", которая позволяет избежать смещения ввода при подсветке.

$("#register").validate({
    debug: true,
    errorClass: 'error help-inline',
    validClass: 'success',
    errorElement: 'span',
    highlight: function(element, errorClass, validClass) {
      $(element).parents("div.control-group").addClass('error').removeClass('success');
    },
    unhighlight: function(element, errorClass, validClass) {
      $(element).parents(".error").removeClass('error').addClass('success');
    }
});

Я хотел бы включить эту проблему как комментарий ответа...; o (,.

Ответ 4

Поскольку я думаю, что это для Twitter Booststrap, это лучшее решение, не требующее обновления проверки jquery:

$("#register").validate({
    debug: true,
    errorClass: 'help-inline',
    validClass: 'success',
    errorElement: 'span',
    highlight: function(element, errorClass, validClass) {
      $(element).parents("div.control-group").addClass("error");

    },
    unhighlight: function(element, errorClass, validClass) {
      $(element).parents(".error").removeClass("error");
    }
});