jQuery: Firefox focusout Event - PullRequest
Новая
       35

jQuery: Firefox focusout Event

1 голос
/ 28 мая 2011

У меня есть два поля ввода в div, я хочу скрыть этот div на focusOut входов, но только если оба они не имеют фокуса.

Это распространенная проблема Firefox(некоторые называют это соблюдением стандарта), но тело документа крадет фокус между.

HTML 

<div id="baz">
   <input type="text" id="foo" name="foo" />
   <input type="text" id="bar" name="bar" />
</div>

jQuery 

// jQuery Example
jQuery(":input").focusout(function(){
   // Don't do anything if one of the input boxes has focus
   if( jQuery(":input").is( jQuery(document.activeElement) ){ return; }

   // Hide the container if one of the inputs loose focus
   jQuery(this).parents("div").css("display","none");
}

Хотя это распространенная ошибка , я забыл, как я ее решал в прошлом.Я думаю, что это было связано с установкой тайм-аута или обновлением экрана перед проверкой activeElement.

jsFiddle Пример

jsFiddle Обновлено (FF4 Та же проблема)

Ответы [ 2 ]

7 голосов
/ 28 мая 2011

Демо 

jQuery(":input").focusout(function(){
    var elem = jQuery(this).parent("div");
    window.setTimeout(function(){
            // Don't do anything if one of the input boxes has focus
            if( jQuery(":input").is( jQuery(document.activeElement) )){ return; }

            // Hide the container if one of the inputs loose focus
            elem.hide();
    }, 0);
})

Демо 

jQuery(document).ready(function () {
    var timeoutID;

    jQuery(":input").focus(function () {
        window.clearTimeout(timeoutID);
    }).focusout(function () {
        timeoutID = window.setTimeout(function () {
            jQuery("#baz").hide();
        }, 0);
    });
});
0 голосов
/ 28 мая 2011

Я думаю, что решение amit_g было почти там. Я смутно помню, что делал это двумя способами:

  1. Сравните входные данные с activeElement (метод, показанный выше)
  2. установка / очистка класса "focus" для элемента для соответствующих событий

Я думаю, что оба метода требуют использования setTimeout, поскольку Firefox имеет задержанный триггер, который нам нужно принудительно вызвать. Хотя я слышал, что FF придерживается стандартов здесь, я лично думаю, что стандарт должен быть изменен.

Таким образом, в дополнение к добавлению временного вызова функции, его также необходимо очистить, если другой «приемлемый» элемент получил фокус. Ниже приведен не производственный код, но он показывает, что он служит примером:

Пример решения

Пример решения (еще лучше) - установите $debug на false

Пример решения (локализованные блоки) - удален беспорядок отладки

...