检测浏览器窗口是否处于活动状态，并在窗口再次处于活动状态后启动事件[JavaScript]

Detecting if browser window is active and start event after window is active again [JavaScript]

本文关键字：活动状态 窗口 启动 事件 JavaScript 是否 浏览器 检测      更新时间：2023-09-26

想法很简单：我有指向另一个网站的按钮。每当用户点击两个以上的链接时，我都希望（通过Ajax）刷新一些内容。为了实现这一点，我需要检测我的窗口是否处于活动状态，因为我只想在用户返回我的页面时启动事件。

事不宜迟，这是我的代码：

$(document).on("click", "a", function() {
        numberOfClicks += 1;
        if (numberOfClicks >= 2)
        {
            userOnWebsiteOrNot();
            numberOfClicks = 0;
        }
    });
    function userOnWebsiteOrNot()
    {
        if (focusedOrNot == 0)
        {
            $('#resultaat').hide().fadeIn(5000);
        }
    }
        window.addEventListener('focus', function() {
            document.title = 'focused';
            focusedOrNot = 0;
        });
        window.addEventListener('blur', function() {
            document.title = 'not focused';
            focusedOrNot = 1;
    });

无论用户是否在页面上，它都会检测到，但不知何故，淡入总是会发生。有人能解释我做错了什么吗？或者给我一些想法吗？

谢谢Yenthe

答案：我需要对三个函数设置一个setTimeOut，因为否则它们检查得太快了。谢谢你的帮助，罗摩！）所有的功劳都归功于罗默的诚实。

$(document).on("click", "a", function() {
        numberOfClicks += 1;
        if (numberOfClicks >= 2)
        {
            haallinks();
            setTimeout(function() {
                userOnWebsiteOrNot();
            }, 2000);
            numberOfClicks = 0;
        }
    });
    function userOnWebsiteOrNot()
    {
        if (focusedOrNot === 0)
        {
            $('#resultaat').hide().fadeIn(5000);
        }
        else
        {
            controlerenActiefOfNiet();
        }
    }
    function controlerenActiefOfNiet()
    {
        setTimeout(function() {
            userOnWebsiteOrNot();
        }, 2000);
    }
    window.addEventListener('focus', function() {
        setTimeout(function() {
            focusedOrNot = 0;
        }, 0);
    });

    window.addEventListener('blur', function() {
        setTimeout(function() {
            focusedOrNot = 1;
        }, 1000);
    });

我认为问题在于，当您第二次单击链接时，window将始终处于焦点位置。JS运行速度相当快。为了克服这个问题，我认为你应该做一个setTimeout()，并将其延迟200ms左右，以便给"失去"焦点的窗口时间

setTimeout(function() {userOnWebsiteOrNot(); },2000);

http://jsfiddle.net/xVHgE/

编辑：向事件侦听器添加延迟。我不认为你可以"延迟"一个事件，只是它运行的函数。

window.addEventListener('focus', function() {
            setTimeout( function() {
                $('#test').html('focus');
                focusedOrNot = 0; 
            } , 5000);
        });
相关文章：