«.ErrorClass» из jQuery validate работает, но класс не может быть найден методом «hasClass ()»

0

проблема

Я не программист, и я пытаюсь сделать некоторые программы.

Я попытался использовать плагин jQuery-validate для управления вводом формы, он отлично работает, Bootstrap может даже найти класс ".text-danger" и изменить его "цвет".

Однако метод ".hasClass()" просто не может.

Я помещал некоторые функции console.log() в циклы for, которые используются для поиска этого класса. Сообщения журнала, которые я получал каждый раз, "изменены", "hasSmall", "noClass".

Я допустил ошибки в коде JS?

Пожалуйста, помогите мне.

Код

Это в моей HTML-форме:

<div class="form-group">
    <label for="username">Username </label>
    <input type="text" class="form-control" name="username" id="signUpUserName" />
</div>
<div class="form-group">
    <label for="password">Password </label>
    <input type="password" class="form-control" name="password" id="signUpPassword" />
</div>
<div class="form-group">
    <label for="email">Email </label>
    <input type="text" class="form-control" name="email" id="signUpEmail" />
</div>

Это JavaScript:

errorPlacement: function(error, element) {
    var obj = $('[name="'+element.attr('name')+'"]');
    obj.siblings('label').append(error);
},

Я изменил некоторые значения в valadate.min.js:

$.extend($.validator, {

defaults: {
    messages: {},
    groups: {},
    rules: {},

    errorClass: "text-danger", // I've changed this
    validClass: "text-success", // this
    errorElement: "small", // and this

    focusInvalid: true,
    errorContainer: $([]),
    errorLabelContainer: $([]),
    onsubmit: true,
    ignore: ":hidden",
    ignoreTitle: false,

Кроме того, JS:

function changeInputAreaStatus(id) {
    $(id).change(function(id) {
        console.log('changed');
        var errorMessageContainer = $(id).siblings('label');
        if(errorMessageContainer.has('small')){
            console.log('hasSmall');
            if (errorMessageContainer.children('small').hasClass('text-danger')) {
                console.log('hasDangerClass');
                errorMessageContainer.parent().removeClass('has-error').addClass('has-error');
            } else if (errorMessageContainer.children('small').hasClass('text-success')) {
                console.log('hasSucessClass');
                errorMessageContainer.parent().removeClass('has-error');
            } else {
                console.log('noClass');
            }
        }
    });
}
    changeInputAreaStatus('#signUpUserName');
    changeInputAreaStatus('#signUpPassword');
    changeInputAreaStatus('#signUpEmail');
  • 0
    Выглядит нормально для меня. Вы определенно смотрите на правильный элемент стиля? Можете ли вы использовать интерфейс отладки вашего браузера для проверки DOM на этом этапе и / или для проверки выражений jQuery?
  • 1
    Где errorPlacement функция errorPlacement ?
Показать ещё 5 комментариев
Теги:
jquery-validate

1 ответ

0
Лучший ответ

Вы должны попробовать что-то вроде этого:

var textSuccess = errorMessageContainer.find('.text-success');
if(textSuccess != null && textSuccess.length > 0){
    console.log('hasSucessClass');
}

это должно помочь вам проверить, имеет ли errorMessageContainer класс успеха в тексте.

С наилучшими пожеланиями

Ещё вопросы

Сообщество Overcoder
Наверх
Меню