Использование плагина jQuery для проверки правильности: onfocusout, onkeyup notworking, как ожидалось на производственном сайте

Я использую jQuery Validate plugin v.1.9.0, он работает очень хорошо. Но я столкнулся с этой проблемой, как только пользователь отправит форму, и если есть какие-либо ошибки, она корректно отобразит сообщение об ошибке. Проблема в том, что он не обновляет сообщение, если пользователь предпринимает действия для исправления этой ошибки. Например. если требуется поле, после получения сообщения в первый раз пользователь начинает печатать, то это сообщение должно уйти.

В документах упоминается, что для этой цели используются onfocusout и onkeyup, и по умолчанию они установлены в true. Самое смешное, что он работает на моей локальной рабочей станции, но он терпит неудачу (тихо), как только я загружу свой код на производственный сайт. Мне показалось, что я как-то рушился, поэтому я активировал jsfiddle и разместил соответствующий код, чтобы увидеть, если это произойдет там также.

Я был поражен, увидев, что это происходит там. Поэтому мой вопрос заключается в том, почему он работает на моей локальной машине, но не на производственных площадках?

P.S. Самостоятельный пример в http://jsfiddle.net/tankchintan/cge44/5/

UPDATE

Чтобы воспроизвести проблему, сделайте -

  • Перейдите на страницу jsfiddle.
  • Без заполнения каких-либо полей нажмите отправить форму.
  • Он будет показывать сообщение об ошибке, кроме каждого поля.
  • Теперь начните печатать в любом из полей.
  • Вы заметите, что сообщение об ошибке не исчезнет, ​​даже если правило выполнено. На моей локальной машине ошибка mesaage исчезает, как только я печатаю что-нибудь в поле.

Ответы

Ответ 1

Эта проблема существует даже в некоторых примерах на веб-сайте JQuery.

Я обнаружил, что проблема возникает, когда элемент ввода не имеет типа. Веб-браузеры предполагают, что тип является "текстом", если не указан, но проблема jquery.validate связана с этим. Элемент ввода должен выглядеть следующим образом:

<input id="cname" name="name" type="text" class="required" minlength="2" />

Ответ 2

Используйте это вместо этого

onkeyup: function(element) { $(element).valid(); },
onfocusout: function(element) { $(element).valid(); },

Ответ 3

По-видимому, это не работает, если ваша библиотека jQuery слишком новая. Я переживал то же самое, откат от jquery v1.7.2 до v1.3.2 исправил проблему.

Страница примера на http://jquery.bassistance.de/validate/demo/ использует 1.3.2, но я не уверен, какая конкретная версия jquery произошла в этом разломе.

Ответ 4

Для меня работает следующее:

$(document).ready(function () {
        $("#myFormElement").submit(function (event) {
            var validator = $.data($('form')[0], 'validator');
            validator.settings.onfocusout = function (element) { $(element).valid(); };
            validator.settings.onkeyup = function (element) { $(element).valid(); };
        });

        var validator = $.data($('form')[0], 'validator');
        validator.settings.onfocusout = false;
        validator.settings.onkeyup = false;
    });

Это отключает проверку первоначальной проверки onkeyup. Если пользователь затем нажимает кнопку submit, мы снова включаем проверку, чтобы после того, как поле было действительным, ему/ей дается немедленная обратная связь.

Я не уверен, почему эти свойства являются логическими изначально, а затем обратные вызовы в случае отправки. Я только нашел метод, установив свойства в true в событии отправки, что вызвало исключение в библиотеке проверки (пыталась вызвать функцию вызова).

Ответ 5

Я думаю, что поведение по умолчанию заключается только в скрытии этого сообщения, когда поле проверяет, например. "Пожалуйста, введите действительный адрес электронной почты" исчезает после ввода "[email protected]", что, я думаю, имеет смысл.

См. демонстрации: http://jquery.bassistance.de/validate/demo/

Я думаю, вы могли бы попытаться сделать что-то похожее на это: jquery validate: focusCleanup: true и focusInvalid: false не работает должным образом