Javascript 窗口是否有获得焦点的浏览器事件？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/3478654/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Is there a browser event for the window getting focus?
提问by Rod
Is there a way that when I click on my browser, and give it focus, to run a method once? And then when the browser loses focus and then gets the focus back to again run that method only once, again.
有没有办法当我点击浏览器并给它焦点时，运行一次方法？然后当浏览器失去焦点然后重新获得焦点时，只再次运行该方法一次。
回答by Daniel Vandersluis
You can attach focusand blurevent handlers on the windowobject to track if the window gets or loses focus (see http://jsfiddle.net/whQFz/for a trivial example). windowapplies to the current browser context (so that could be a window, a tab, a frame, etc.).
您可以在对象上附加focus和blur事件处理程序window以跟踪窗口是否获得焦点或失去焦点（有关一个简单示例，请参见http://jsfiddle.net/whQFz/）。window适用于当前浏览器上下文（因此可以是窗口、选项卡、框架等）。
Note :The focusevent will fire every time the window gets focus and the blurevent will fire every time it loses focus. An example of something that takes focus away from the window is an alertwindow. If you try to alert in an onfocusevent handler you'll get an infinite loop of alerts!
注：该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 " + nCounter;
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);
回答by Brett Weber
$(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);
}
回答by Pylinux
If you are targeting browsers newer than IE9 you should really use the "Page Visibility API" javascript browser api: https://developer.mozilla.org/en-US/docs/Web/Guide/User_experience/Using_the_Page_Visibility_API
如果您的目标浏览器比 IE9 更新，您应该真正使用“页面可见性 API”javascript 浏览器 API：https: //developer.mozilla.org/en-US/docs/Web/Guide/User_experience/Using_the_Page_Visibility_API
回答by prashantsahni
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();
