.focus() установить фокус на целевом вводе не будет работать в Firefox

У меня есть поле ввода. При определенных условиях я хочу, чтобы пользователь сосредоточился на поле ввода, когда он нажимает клавишу Tab. По сути, я имитирую функциональность окна поиска Google с автоматическим заполнением. У меня все работает нормально во всех браузерах, кроме того, с которым у меня никогда не было проблем... Firefox!?

Следующий код работает, как и ожидалось, в IE, Chrome и Safari, если вы выходите из текстового поля с помощью класса myInput, ваш фокус остается в текстовом поле. Но в Firefox, когда вы выходите из текстового поля, вы переходите к следующему текстовому полю. (Это очень упрощенная версия того, что я делаю. Если я смогу заставить это работать, я смогу заставить работать мой реальный код.)

$(document).ready(
    function()
    {               
        $(".myInput").blur
        (
            function()
            {
                $(this).focus();
                $(this).select();
            }
        );      
    }
);

PS. Пожалуйста, не предлагайте исправление с помощью setTimeout(). Спасибо.

Я читал статьи, описывающие, как у jQuery есть .focus(), а у javascript есть .focus() и как они не совпадают. Я это понимаю (думаю), но до сих пор не могу понять, что я делаю не так.

ДОБАВЛЕНО... Я могу заставить его работать таким образом

$(document).ready(
    function()
    {               
        $(".myInput").blur
        (
            function()
            {
                setTimeout("$('.myInput').focus();",1);
            }
        );      
    }
);

Кажется хакерским, но я не могу понять, почему Firefox не устанавливает фокус на размытие. Так что, если у кого-то из вас есть ответ, было бы неплохо узнать.


person Stephen Stanley    schedule 16.03.2011    source источник
comment
Вы пробовали отлаживать свой код? На что ссылается $(this) внутри вашего обработчика размытия? Он хоть горит?   -  person Mike Dinescu    schedule 16.03.2011
comment
Думаю, я сделал предположение, что $(this) относится к текстовому полю $(.myInput), так как этот код работает в Chrome и IE. Этот код не позволит вам выйти из текстового поля с классом .myInput как в IE, так и в Chrome, поэтому я предполагаю, что $(this) настроен правильно. И моя консоль ошибок FireFox не сообщает об ошибках.   -  person Stephen Stanley    schedule 16.03.2011
comment
stackoverflow.com/questions/4236477 / stackoverflow.com/questions/4640687/   -  person Fraser    schedule 16.03.2011


Ответы (3)


Поскольку вы используете jQuery, следует использовать метод .focusout().

http://api.jquery.com/focusout/

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

person Fraser    schedule 16.03.2011
comment
Я видел .focusout и заменил .blur на .focusout, но получил те же результаты. В IE и Chrome вы не можете выйти из текстового поля с помощью табуляции, в FF вы можете. Во всех случаях код в .focusout или .blur с триггером. Как и alert(), но FF не будет учитывать .focus(). - person Stephen Stanley; 16.03.2011
comment
$('.myInput').live('focusout', function() { $('.myInput').focus(); }); - person Fraser; 17.03.2011

Я смог разрешить свою ситуацию, избегая моего вопроса выше.

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

displayTextBox.keydown
(
    function(event)
    {           
        // 9 = Tab Key
        if (event.keyCode == "9")
        {
            event.preventDefault();
        }
    }
);

Я не проверял это полностью, но, похоже, пока работает в FF, Chrome и IE.

person Stephen Stanley    schedule 16.03.2011

Попробуйте использовать атрибут html onfocusout

person Thew    schedule 16.03.2011