檢測時，瀏覽器標籤/窗口被激活

我曾嘗試：

$(window).on('focus', function(){ 
    console.log(1); 
}); 
$(window).on('blur', function(){  
    console.log(2);  
});

但似乎它的工作，只有當用戶點擊窗口。但在用戶點擊時顯示2，例如。瀏覽器地址欄。

我想要實現的是檢測當前標籤何時激活一個。

如何提高此代碼？

來源

2014-10-19 LJ Wadowski

你無法檢查。你可以檢查的是如果用戶將鼠標移動到標籤上（但標籤也可以是活動的，但鼠標在其他地方）。 – hffmr 2014-10-19 15:01:38

現代瀏覽器具有頁面可見性API：http://caniuse.com/#search=page可見性 – Mottie 2014-10-19 15:06:33

活動意味着選項卡可見時。但是，如果你要告訴我們，如果用戶的鼠標是直接在頁面上，你可以這樣做：

<html onmouseenter="document.getElementById('h1').innerHTML = 'active'"onmouseleave="document.getElementById('h1').innerHTML = 'not active'"> 
 
    <body style="width:100%;height:100px"> 
 
    <h1 id="h1">not active</h1> 
 
    </body> 
 
</html>

通過簡單的代碼上面，你可以告訴我們，如果用戶鼠標在頁面或不

上

編輯：使用頁面可見性API：

var hidden, visibilityChange; 
if (typeof document.hidden !== "undefined") { 
    hidden = "hidden"; 
    visibilityChange = "visibilitychange"; 
} 
else if (typeof document.mozHidden !== "undefined") { 
    hidden = "mozHidden"; 
    visibilityChange = "mozvisibilitychange"; 
} 
else if (typeof document.msHidden !== "undefined") { 
    hidden = "msHidden"; 
    visibilityChange = "msvisibilitychange"; 
} 
else if (typeof document.webkitHidden !== "undefined") { 
    hidden = "webkitHidden"; 
    visibilityChange = "webkitvisibilitychange"; 
} 

function handleVisibilityChange() { 
    if (document[hidden]) { 
     //Not visible, Do whatever 
    } 
    else { 
     //Visible 
    } 
} 

if (typeof document.addEventListener === "undefined" || 
    typeof document[hidden] === "undefined") { 
    alert("This demo requires a browser, such as Google Chrome or Firefox, that supports the Page Visibility API."); 
} 
else { 
    document.addEventListener(visibilityChange, handleVisibilityChange, false);

來源

2014-10-19 15:00:22 DividedByZero

檢測時，瀏覽器標籤/窗口被激活

回答

相關問題