js監聽用戶進入和離開當前頁面

Berwin 發布于2019-08-26 14:06 / 2218人閱讀

摘要：事件用于用戶是否離開當前頁面頁面的屬性可能返回三種狀態，和監聽事件頁面變為不可見時觸發離開頁面變為可見時觸發回來頁面的屬性離開回來

VisibilityChange 事件；用于用戶是否離開當前頁面

// 頁面的 visibilityState屬性可能返回三種狀態 prerender，visible 和 hidden 
// 監聽 visibility change 事件 
document.addEventListener("visibilitychange", function() {
  // 頁面變為不可見時觸發 
  if (document.visibilityState == "hidden") {
    document.title = "離開";
  } 
  // 頁面變為可見時觸發 
  if (document.visibilityState == "visible") { 
    document.title = "回來";
  } 
});

// 頁面的 hidden屬性,false,true;
document.addEventListener("visibilitychange",function(){
    var isHidden = document.hidden;
    if(isHidden){
        document.title = "離開";
    } else {
        document.title = "回來";
    }
});

GPU云服務器云服務器 js離開頁面頁面離開提示js js關閉當前頁面 js 重定向當前頁面

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/110049.html

PageVisibilityAPI簡單易學教程演示

　　一、簡介　　要知道用戶何時離開，有常用的方法是監聽下面三個事件。　　pagehide　　beforeunload　　unload　　可上述三種方法有一個bug就是，這些事件在手機上可能不會觸發，頁面就直接關閉了。因為手機系統可以將一個進程直接轉入后臺，然后殺死?！　∮脩酎c擊了一條系統通知，切換到另一個 App?！　∮脩暨M入任務切換窗口，切換到另一個 App?！　∮脩酎c擊了 Home 按鈕，切換...

3403771864 2022-10-23 13:23 評論0 收藏0
Vue.js基礎教程

摘要：自定義名稱縮放控制器可以使用中的動畫設計更為華麗的效果。在和中必須使用，不然它們會同時生效，動畫也會瞬間完成。先在標簽內加入，接著類似自定義動畫可以給命名。文章鏈接：Vue.js基礎教程開發工具準備：根據個人喜歡選擇IDE，我使用的是WebStorm，推薦使用Atom和VSCode；安裝git base和node.js；安裝vue-cli，命令npm i -g @vue/...

XboxYan 2019-08-23 15:24 評論0 收藏0
js全屏模式輕松掌握[局部元素全屏展示]

摘要：推薦這么做，因為如果每個都要這樣重復的判斷瀏覽器前綴，那也太惡心了瀏覽器是否支持全屏模式屬性返回一個布爾值，表示當前文檔是否可以切換到全屏狀態。 showImg(https://segmentfault.com/img/remote/1460000017229080?w=700&h=467); 我第一次對網頁全屏模式有概念，是那種網頁播放視頻的全屏播放的那種。感覺很強，前幾個星期有個...

amc 2019-08-23 13:50 評論0 收藏0
瀏覽器常用事件解析

摘要：之前寫過一篇瀏覽器事件的相關操作和事件運行的原理瀏覽器事件解析。注意，頁面從瀏覽器緩存加載，并不會觸發事件。事件有一個屬性，返回一個布爾值。此外，不支持事件，可以使用事件代替。之前寫過一篇瀏覽器事件的相關操作和事件運行的原理——JavaScript瀏覽器事件解析。這一篇主要寫一些常用的事件及一些可能的坑。表單事件鍵盤事件當 , 的值發生變化時觸發。此外，打開 contente...

zhoutk 2019-08-02 16:04 評論0 收藏0