我正在制作一个计数器,当文档聚焦时它会倒计时。当它处于模糊状态时,它会停止倒计时。
它在 FF 中工作,但在 Safari 和 Chrome 中,计数器根本不起作用。
Safari/Chrome 是否存在兼容性问题?
我所使用的是$(document).blur()
and $(document).focus()
,并且两者都在一个$(document).ready()
block.
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);
});
});
我一直用$(window).focus()
and $(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);
});
});
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)