新聞中心
這篇文章主要介紹了html5中判斷當(dāng)前頁(yè)面可見性狀態(tài)的方法,具有一定借鑒價(jià)值,需要的朋友可以參考下。希望大家閱讀完這篇文章后大有收獲。下面讓小編帶著大家一起了解一下。
visibilitychange
頁(yè)面事件來(lái)判斷當(dāng)前頁(yè)面可見性的狀態(tài),并針對(duì)性的執(zhí)行某些任務(wù)
新出現(xiàn)的document.hidden
屬性,它顯示頁(yè)面是否為用戶當(dāng)前觀看的頁(yè)面,值為ture或false。
visibilityState
的值要么是visible
(表明頁(yè)面為瀏覽器當(dāng)前激活tab,而且窗口不是最小化狀態(tài)),要么是hidden
(頁(yè)面不是當(dāng)前激活tab頁(yè)面,或者窗口最小化了。),或者prerender
(頁(yè)面在重新生成,對(duì)用戶不可見。).
// 各種瀏覽器兼容 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"; } // 添加監(jiān)聽器,在title里顯示狀態(tài)變化 document.addEventListener(visibilityChange, function() { document.title = document[state]; }, false); // 初始化 document.title = document[state];
添加監(jiān)聽
document.addEventListener("visibilitychange", function() { console.log( document.visibilityState ); }); document.addEventListener("msvisibilitychange", function() { console.log( document.msVisibilityState); }); document.addEventListener("mozvisibilitychange", function() { console.log( document.mozVisibilityState); }); document.addEventListener("webkitvisibilitychange", function() { console.log( document.webkitVisibilityState); });
感謝你能夠認(rèn)真閱讀完這篇文章,希望小編分享html5中判斷當(dāng)前頁(yè)面可見性狀態(tài)的方法內(nèi)容對(duì)大家有幫助,同時(shí)也希望大家多多支持創(chuàng)新互聯(lián)建站,關(guān)注創(chuàng)新互聯(lián)網(wǎng)站制作公司行業(yè)資訊頻道,遇到問(wèn)題就找創(chuàng)新互聯(lián)建站,詳細(xì)的解決方法等著你來(lái)學(xué)習(xí)!
分享名稱:html5中判斷當(dāng)前頁(yè)面可見性狀態(tài)的方法-創(chuàng)新互聯(lián)
文章位置:http://www.ef60e0e.cn/article/eoopc.html