SafariやChromeで$（document）.blur（）と$（document）.focus（）が動作しないのはなぜですか？

Question

私は、ドキュメントがフォーカスされているときにカウントダウンするカウンタを作っています。それがぼやけているとき、それはカウントダウンを止める。

FFで動作していますが、SafariとChromeではカウンタがまったく動作しません。

Safari/Chromeとの互換性に問題がありますか？

私が使用しているのは、$(document).blur()と$(document).focus()です。両方とも$(document).ready()ブロック内にあります。

var tm; 
$(document).ready(function(){ 

     var seconds = 50; 
     $('#timer').html(seconds); 
     countdown(); 

    $(window).focus(function(){ 
     function countdown(){ 
     if (seconds > 0) { 
      seconds--; 
      $('#timer').text(seconds); 
      tm = setTimeout(countdown,1000); 
      } 
     if (seconds<=0){ 
      $('#timer').text('Go'); 
      } 
     }); 



    $(window).blur(function(){ 
     clearTimeout(tm); 
     seconds++; 
     $('#timer').text(seconds); 

    }); 
}); 

Answer 1

私はいつも$(window).focus()と$(window).blur()を使用しました。代わりにこれらを試してください。

また、「フォーカス」イベントは〜ドキュメントの読み込みで発生しますが、ChromeとSafariではウィンドウがフォーカスを失った後で元の状態に戻ったときにのみ起動されることに注意してください。

UPD：あなたのコードを貼り付けたようは今、私は（たぶん）あなたの目的に合うようにそれを作り直し：

var tm; 
var seconds = 50; 
var inFocus = true; 

function countdown() { 
    if (seconds > 0) { 
     seconds--; 
    } 

    if (seconds <= 0) { 
     $('#timer').text('Go'); 
    } 
    else { 
     $('#timer').text(seconds); 
     tm = setTimeout(countdown, 1000); 
    } 
} 

$(function() { 
    $('#timer').html(seconds); 
    countdown(); 

    $(window).focus(function() { 
     if(!inFocus) { 
      countdown(); 
     } 
    }); 

    $(window).blur(function() { 
     inFocus = false; 
     clearTimeout(tm); 
     seconds++; 
     $('#timer').text(seconds); 
    }); 
});