簡體   English   中英

使用純JS或jQuery檢測瀏覽器頁面窗口何時失去與Alt-Tab的焦點

[英]Detect when a browser page window loses focus with Alt-Tab using pure JS or jQuery

是否可以檢測當前頁面在alt-tab中? 僅當在瀏覽器中打開新選項卡時,此代碼才有效:

(function() {
  var hidden = "hidden";

  // Standards:
  if (hidden in document)
    document.addEventListener("visibilitychange", onchange);
  else if ((hidden = "mozHidden") in document)
    document.addEventListener("mozvisibilitychange", onchange);
  else if ((hidden = "webkitHidden") in document)
    document.addEventListener("webkitvisibilitychange", onchange);
  else if ((hidden = "msHidden") in document)
    document.addEventListener("msvisibilitychange", onchange);
  // IE 9 and lower:
  else if ("onfocusin" in document)
    document.onfocusin = document.onfocusout = onchange;
  // All others:
  else
    window.onpageshow = window.onpagehide
    = window.onfocus = window.onblur = onchange;

  function onchange (evt) {
    var v = "visible", h = "hidden",
        evtMap = {
          focus:v, focusin:v, pageshow:v, blur:h, focusout:h, pagehide:h
        };

    evt = evt || window.event;
    if (evt.type in evtMap)
      document.body.className = evtMap[evt.type];
    else
      document.body.className = this[hidden] ? "hidden" : "visible";
  //console.log(this[hidden] ? "hidden" : "visible");
  }

  // set the initial state (but only if browser supports the Page Visibility API)
  if( document[hidden] !== undefined )
    onchange({type: document[hidden] ? "blur" : "focus"});
})();

但是此代碼不會檢測到瀏覽器的新窗口,也不會檢測到Alt-tab進入任何其他程序。 有可能檢測到它嗎? 還是在jQuery中?

編輯新頁面表示Ctrl(cmd)+ N(新窗口)熱鍵。 上面的代碼無法檢測到這一點。 Alt(cmd)+ tab到另一個程序-也無法檢測到。 上面的代碼只能檢測Ctrl(cmd)+ T(新標簽)

編輯我想檢測用戶何時從另一個應用程序返回我的網站。 也就是說,如果用戶關閉任何選項卡(例如,通過Ctrl + W組合鍵)並返回到我的網站,則可以使用上面的腳本檢測到此操作。 但是,如果用戶從另一個應用程序(例如,通過Alt + Tab)返回我的網站,則該腳本將無法運行,因為window.onfocus將不會被觸發! 那是,

 window.onpageshow =
 window.onpagehide = window.onfocus = window.onblur 

不適用於Alt + Tab動作。 更清楚了嗎?

您可以簡單地在window上使用onfocus事件,例如:

window.onfocus = function() {
  console.log('Got focus');
}

如果需要,還可以使用onblur進行更敏銳的處理。

有一個頁面可見性API: https//developer.mozilla.org/en-US/docs/Web/API/Page_Visibility_API

document.addEventListener("visibilitychange", handleVisibilityChange, false)

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM