为什么 $(document).blur() 和 $(document).focus() 不能与 Safari 或 Ch

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()。试试这些。

另外，请注意，在FF和IE中，"焦点"事件在~文档加载时触发，而在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);
    });
});