[JQUERY] 브라우저 / 탭이 활성화되어 있는지 확인하는 방법 [중복]

브라우저 / 탭이 활성화되어 있는지 확인하는 방법 [중복]

해결법

1. ---

   1.당신은 윈도우의 초점 흐림 이벤트를 사용합니다 :

   당신은 윈도우의 초점 흐림 이벤트를 사용합니다 :

   var interval_id;
   $(window).focus(function() {
       if (!interval_id)
           interval_id = setInterval(hard_work, 1000);
   });
   
   $(window).blur(function() {
       clearInterval(interval_id);
       interval_id = 0;
   });
   

   사용의 jQuery 쉽게 내 댓글 "더블 화재"의 발행 및 체류에 대답 :

   $(window).on("blur focus", function(e) {
       var prevType = $(this).data("prevType");
   
       if (prevType != e.type) {   //  reduce double fire issues
           switch (e.type) {
               case "blur":
                   // do work
                   break;
               case "focus":
                   // do work
                   break;
           }
       }
   
       $(this).data("prevType", e.type);
   })
   

   작업을 보여주는 예제 코드를 보려면 클릭 (JSFiddle)

2. ---

   2.리처드 SIMOES뿐만 아니라 당신은 또한 페이지 가시성 API를 사용하여 응답합니다.

   리처드 SIMOES뿐만 아니라 당신은 또한 페이지 가시성 API를 사용하여 응답합니다.

   if (!document.hidden) {
       // do what you need
   }
   

3. ---

   3.나는 window.onfocus 및 window.onblur 이벤트 플래그를 설정하려고합니다.

   나는 window.onfocus 및 window.onblur 이벤트 플래그를 설정하려고합니다.

   다음 코드는 앞뒤로 탭 사이의 콘솔 및 이동을 열고, 파이어 폭스, 사파리와 크롬에서 테스트되었습니다 :

   var isTabActive;
   
   window.onfocus = function () { 
     isTabActive = true; 
   }; 
   
   window.onblur = function () { 
     isTabActive = false; 
   }; 
   
   // test
   setInterval(function () { 
     console.log(window.isTabActive ? 'active' : 'inactive'); 
   }, 1000);
   

   여기를보십시오.

4. ---

   4.jQuery를 사용하여 :

   jQuery를 사용하여 :

   $(function() {
       window.isActive = true;
       $(window).focus(function() { this.isActive = true; });
       $(window).blur(function() { this.isActive = false; });
       showIsActive();
   });
   
   function showIsActive()
   {
       console.log(window.isActive)
       window.setTimeout("showIsActive()", 2000);
   }
   
   function doWork()
   {
       if (window.isActive) { /* do CPU-intensive stuff */}
   }
   

5. ---

   5.(rockacola의 제외) 여기에 모든 예제는 사용자가 물리적으로 초점을 정의하는 창을 클릭해야합니다. 이 때문에 .hover (), 적합하지 않습니다 더 나은 선택이다 :

   (rockacola의 제외) 여기에 모든 예제는 사용자가 물리적으로 초점을 정의하는 창을 클릭해야합니다. 이 때문에 .hover (), 적합하지 않습니다 더 나은 선택이다 :

   $(window).hover(function(event) {
       if (event.fromElement) {
           console.log("inactive");
       } else {
           console.log("active");
       }
   });
   

   사용자가 화면에 마우스를 가지고 때 사용자의 마우스 다른 전경에 있다면 그것은 여전히 ​​당신을 말하지 않을 것이다하지만 이것은 당신에게 말할 것이다.

6. ---

   6.당신은 다음 호버 () 이벤트가 도움이 될 수 있습니다 (사용자 페이지에 '초점'때 특정 이벤트가 트리거) 크롬에서 열린 구글 검색 페이지, 비슷한 일을하려고하는 경우.

   당신은 다음 호버 () 이벤트가 도움이 될 수 있습니다 (사용자 페이지에 '초점'때 특정 이벤트가 트리거) 크롬에서 열린 구글 검색 페이지, 비슷한 일을하려고하는 경우.

   $(window).hover(function() {
     // code here...
   });
   

from https://stackoverflow.com/questions/1760250/how-to-tell-if-browser-tab-is-active by cc-by-sa and MIT license