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

Question

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

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

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

PS Автономный пример на http://jsfiddle.net/tankchintan/cge44/5/

ОБНОВЛЕНИЕ

Чтобы повторить проблему, выполните -

1. Перейдите на страницу jsfiddle.
2. Не заполнив поля, нажмите "Отправить".
3. Это покажет ошибкусообщение рядом с каждым полем.
4. Теперь начните вводить текст в любом из полей.
5. Вы заметите, что сообщение об ошибке не исчезает, даже если правило выполнено.На моей локальной машине эта ошибка исчезнет, ​​когда я наберу что-нибудь в поле.

Answer 1

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

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

Answer 2

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

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

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

Answer 3

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

$(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;
    });

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

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

Answer 4

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

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

Answer 5

Я думаю, что поведение по умолчанию - скрывать это сообщение только при проверке поля, например, «Пожалуйста, введите действительный адрес электронной почты» исчезает после ввода «foo@example.com», что, я думаю, имеет смысл.

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

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