js 怎樣判斷用戶是否在瀏覽當前頁面


可以通過document.hidden屬性判斷當前頁面是否是激活狀態。

兼容性:IE10+,Firefox10+,Chrome14+,Opera12.1+,Safari7.1+

兼容性寫法示例:

var hiddenProperty = 'hidden' in document ? 'hidden' :    
    'webkitHidden' in document ? 'webkitHidden' :    
    'mozHidden' in document ? 'mozHidden' :    
    null;
var visibilityChangeEvent = hiddenProperty.replace(/hidden/i, 'visibilitychange');
var onVisibilityChange = function(){
    if (!document[hiddenProperty]) {    
        console.log('頁面非激活');
    }else{
        console.log('頁面激活')
    }
}
document.addEventListener(visibilityChangeEvent, onVisibilityChange);
你可以使用 onblur 和 onfocus 判斷頁面是否在最前端(獲取焦點)
如果 onblur,停止向服務器請求,當 onfocus,繼續請求

下面這個例子可以更好的演示我上面說的,你只是需要把輸出數字換為 ajax 的工作。
打開頁面,先輸出幾個數字,轉到其它頁面,等待幾秒,再回去,數字應該接着上次離開時候的值繼續輸出。
1
2
3
...
20
21
22

<script type="text/javascript">
var count = 1;
var interval_output = null;

function output_number() {
document.body.innerHTML += (count + " ");
count++;
}

// window 失去焦點,停止輸出
window.onblur = function() {
clearInterval(interval_output);
};

// window 每次獲得焦點
window.onfocus = function() {
// 每 1 秒在頁面輸出一個數
interval_output = setInterval(function() {
output_number();
}, 1000);
}
</script>

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM