Есть ли способ обнаружить, что это окно в настоящее время активно в IE8?

Есть ли способ обнаружить, что окно в настоящее время активно (отображается в активной вкладке/окне) в IE8?

Я знаю, что есть такие события, как onfocusin/onfocus - но это не идеальное решение, так как окно также должно получать фокус для события, которое должно быть запущено - так что это не работает, когда пользователь просто переключает вкладки, не касаясь самого окна.

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

Ответ 1

Ive написал плагин jQuery, который делает это: http://mths.be/visibility Он дает вам очень простой API, который позволяет выполнять обратные вызовы, когда страницы изменения состояния видимости.

Он делает это, используя API видимости страницы, где он поддерживается, и возвращается к старым старым focus и blur в старых браузерах.

Демо: http://mathiasbynens.be/demo/jquery-visibility

Этот плагин просто предоставляет вам два настраиваемых события: show и hide. Когда состояние видимости страницы изменится, будет активировано соответствующее событие.

Вы можете использовать их отдельно:

$(document).on('show', function() {
  // the page gained visibility
});

... и...

$(document).on('hide', function() {
  // the page was hidden
});

Поскольку большую часть времени вам понадобятся оба события, ваш лучший вариант - использовать карту событий. Таким образом, вы можете связать оба обработчика событий за один раз:

$(document).on({
  'show': function() {
    console.log('The page gained visibility; the `show` event was triggered.');
  },
  'hide': function() {
    console.log('The page lost visibility; the `hide` event was triggered.');
  }
});

Плагин обнаружит, поддерживает ли API видимости страницы в браузере или нет, и выставляет эту информацию как логическую (true/false) в $.support.pageVisibility:

if ($.support.pageVisibility) {
  // Page Visibility is natively supported in this browser
}

Ответ 2


var isActive = false;
function onBlur() {
    isActive = false;
};
function onFocus(){
    isActive = true;
};

if (/*@[email protected]*/false) { // check for Internet Explorer
    document.onfocusin = onFocus;
    document.onfocusout = onBlur;
} else {
    window.onfocus = onFocus;
    window.onblur = onBlur;
}

Ответ 3

Это простая задача для достижения использования jQuery:

$(function() {
    window.isActive = true;
    $(window).focus(function() { this.isActive = true; });
    $(window).blur(function() { this.isActive = false; });
});

Глобальная переменная isActive определяет, насколько вкладка/окно имеет смысл.

Ответ 4

<script>

    // Adapted slightly from Sam Dutton
    // Set name of hidden property and visibility change event
    // since some browsers only offer vendor-prefixed support
    var hidden, state, visibilityChange; 
    if (typeof document.hidden !== "undefined") {
        hidden = "hidden";
        visibilityChange = "visibilitychange";
        state = "visibilityState";
    } else if (typeof document.mozHidden !== "undefined") {
        hidden = "mozHidden";
        visibilityChange = "mozvisibilitychange";
        state = "mozVisibilityState";
    } else if (typeof document.msHidden !== "undefined") {
        hidden = "msHidden";
        visibilityChange = "msvisibilitychange";
        state = "msVisibilityState";
    } else if (typeof document.webkitHidden !== "undefined") {
        hidden = "webkitHidden";
        visibilityChange = "webkitvisibilitychange";
        state = "webkitVisibilityState";
    }
    // Add a listener that constantly changes the title
    document.addEventListener(visibilityChange, function() {
        document.title = document[state];
    }, false);

    // Set the initial value
    document.title = document[state];

</script>

Ответ 5

document.addEventListener("visibilitychange", () => { 
    if (document.visibilityState === 'visible') alert("Hello again"); 
});

См. API видимости страницы в MDN для получения дополнительной информации.

Ответ 6

Использование браузера по умолчанию API видимости страницы.

function isPageHidden(){
    if (typeof(document.hidden) === 'boolean') return document.hidden;
    if (typeof(document.msHidden) === 'boolean') return document.msHidden;
    if (typeof(document.webkitHidden) === 'boolean') return document.webkitHidden;
    if (typeof(document.mozHidden) === 'boolean') return document.mozHidden;
    else return undefined;
}