Есть ли событие браузера для окна, получающего фокус?

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

Ответ 1

Вы можете прикрепить обработчики событий focus и blur к объекту window, чтобы отслеживать, получает ли окно фокус или теряет фокус (тривиальный пример см. в http://jsfiddle.net/whQFz/). window применяется к текущему контексту браузера (таким как окно, вкладка, фрейм и т.д.).

Примечание: Событие focus будет срабатывать каждый раз, когда окно получает фокус, а событие blur срабатывает каждый раз, когда оно теряет фокус. Примером чего-то, что отвлекает внимание от окна, является окно alert. Если вы попытаетесь сделать предупреждение в обработчике событий onfocus, вы получите бесконечный цикл предупреждений!

// Set global counter variable to verify event instances
var nCounter = 0;

// Set up event handler to produce text for the window focus event
window.addEventListener("focus", function(event) 
{ 
    document.getElementById('message').innerHTML = "window has focus " + nIndex; 
    nCounter = nCounter + 1; 
}, false);

// Example of the blur event as opposed to focus
// window.addEventListener("blur", function(event) { 
// document.getElementById('message').innerHTML = "window lost focus"; }, 
// false);

Ответ 2

$(document).ready(function() { $(window).one("focus", SomeFocusMethod); } );

var SomeFocusMethod = function()
{
    // do stuff
    $(window).one("blur", SomeBlurMethod);
}

var SomeBlurMethod = function() 
{ 
    // do stuff
    $(window).one("focus", SomeFocusMethod); 
}

Ответ 3

Если вы ориентируетесь на браузеры, более новые, чем IE9, вам действительно следует использовать API-интерфейс браузера JavaScript "Видимость страницы":https://developer.mozilla.org/en-US/docs/Web/Guide/User_experience/Using_the_Page_Visibility_API

Ответ 4

function blinkTab() {
    const browserTitle = document.title;

    const stopBlinking = () => {
        document.title = browserTitle;
    };

    const startBlinking = () => {
        document.title = 'My New Title';
    };

    function registerEvents() {
        window.addEventListener("focus", function(event) { 
            stopBlinking();
        }, false);

        window.addEventListener("blur", function(event) {
            setInterval(() => {
                startBlinking();
            }, 500);

        }, false);
    };

    registerEvents();
};


blinkTab();