Javascript / JQuery: как добавить событие нажатия / размытия, которое не срабатывает дважды, с окном оповещения? Только IE - PullRequest
Новая
       11

Javascript / JQuery: как добавить событие нажатия / размытия, которое не срабатывает дважды, с окном оповещения? Только IE

3 голосов
/ 14 сентября 2011

У меня есть поле ввода, которое я хотел бы проверить, когда пользователь нажимает клавишу ввода или щелкает по нему, для этого я использую события keypress и blur.Если ввод не проходит проверку, вызывается окно с предупреждением.

Я заметил, что в IE (все версии), если я нажимаю ввод с неверным вводом, по какой-то причине срабатывают события нажатия клавиш и размытия (подозреваю, чтоэто окно оповещения, но оно не делает этого в FF / Chrome) и показывает два одинаковых окна оповещения.Как сделать так, чтобы отображался только один?

РЕДАКТИРОВАТЬ: В FF / Chrome теперь я заметил, что появляется второе окно с предупреждением, когда я щелкаю в любом месте после попытки подтвердить с помощью ввода.

Упрощенный код: 

$("#input-field").keypress(function(event) {
    if (event.keycode == 13) {
        event.stopPropagation();
        validate();
        return false;
    }
});

$("#input-field").blur(function() {
    validate();
});

function validate() {
    if ($("#input-field").val() == '') {
        alert("Invalid input");
    }
}

РЕДАКТИРОВАТЬ: Ах-ха.Не совсем исправление, но отдельная деталь, которую я забыл - мне нужно восстановить недопустимый ввод до его ранее действительного значения, поэтому, когда функция validate проверяет значение снова, это не дает сбоя дважды.

Ответы [ 2 ]

2 голосов
/ 04 мая 2012

Я закончил тем, что просто проверял пользовательский агент IE и пропускал событие нажатия клавиши для IE (связывание нажатия клавиш и размытия с той же функцией, как показано ниже). К сожалению, это не прямое или потрясающее решение, но я пытался решить эту проблему безрезультатно. Несколько небольших замечаний, которые могут быть полезны: jQuery нормализует, что позволяет уверенно использовать e.which == 13 при нажатии клавиш. Я бы также объединил функции в одну привязку, например 

$("#input-field").bind('blur keypress', function(e) {
    if(e.which == 13) {
        // keypress code (e.g. check for IE and return if so)
    }
    validate();
});

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

0 голосов
/ 16 декабря 2011

Firefox не получает правильное событие keypress.Эти события запускаются только тогда, когда нажата комбинация клавиш, которая производит символ (что отличается от нажатия любой клавиши).

Вместо этого используйте keydown (поскольку это, вероятно, единственное событие, которое IE обрабатывает правильно -как и следовало ожидать, поскольку MS "изобрела" его ;-)).

См. http://www.quirksmode.org/dom/events/keys.html.

...