Изменение вкладок браузера нежелательно вызывает событие фокуса, особенно в Google Chrome

У меня есть небольшая проблема с фокусным событием, о котором я только что узнал. По-видимому, фокус срабатывает при переключении на другую вкладку браузера, а затем обратно. Я бы предпочел, чтобы этого не случилось; Является ли это возможным?

Я никогда не знал об этом до сегодняшнего дня. Вот небольшая демонстрация: http://jsfiddle.net/MJ6qb/1/

var times = 0;
$('input').on('focus', function() {
    times ++;
    $(this).after('<br>Focused '+times+' times');   
});

Воспроизведение. Сосредоточьтесь на входе, затем переключите вкладки браузера, затем переключитесь обратно. Кажется, что все браузеры запускают фокусное событие, когда вы переключаетесь на вкладку, и Google Chrome 19 стреляет дважды !

В идеале функция не должна запускаться при переключении вкладок браузера, но только при нажатии на пользователя или Tab, но теперь, когда я знаю о проблеме Chrome, я немного больше обеспокоен этим, потому что это приводит к лишней ненужной обратной -to-back AJAX в моем реальном приложении (это для получения результатов для автозаполнения, которое должно быть актуальным, но не настолько, что я хочу использовать событие keyup).

Это не похоже на jQuery (я тестировал с помощью javascript), но я могу использовать jQuery для решения. Есть ли что-нибудь, что я могу сделать по этому поводу? Я знаю, что могу использовать jQuery one() но я хочу, чтобы функция запускалась более одного раза.

Ответ 1

Попробуйте это

var times = 0;
var prevActiveElement;

    $( window ).on( "blur", function(e){
            prevActiveElement = document.activeElement;
    });

    $('input').on('focus', function() {
        if (document.activeElement === prevActiveElement) {
            return;
        }
        prevActiveElement = document.activeElement;
        times++;
        $(this).after('<br>Focused ' + times + ' times');
    }).on( "blur", function(){
        prevActiveElement = null;  
    });

Ответ 2

Попробуйте это, чтобы решить проблему:

var times = 0, foc=true;

$(window).on('focus', function() {
    foc = false;
    setTimeout(function() {foc=true}, 200);
});

$('input').on('focus', function() {
    if (foc || times===0) {
        times ++;
        $(this).after('<br>Focused '+times+' times');   
    }
});

FIDDLE