在浏览器中的选项卡之间切换时停止计时器
stop timer when switch between tabs in browser
这是我写的
脚本我想在用户切换到不同的选项卡时停止计时器,并在访问网站时恢复。谁能帮我解决这个任务。
$(document).ready(function() {
window.setInterval(function() {
var timeLeft = $("#timeLeft").html();
if(eval(timeLeft) == 0){
window.location= ($("#url_online").html());
}else{
$("#timeLeft").html(eval(timeLeft)- eval(1));
}
}, 1000);
});
var time=$("#times").html();
var tt=time.split(":");
var seconds =tt[0]*60+tt[1]*1;
function secondPassed() {
var minutes = Math.round((seconds - 30)/60);
var remainingSeconds = seconds % 60;
if (remainingSeconds < 10) {
remainingSeconds = "0" + remainingSeconds;
}
document.getElementById('countdown').innerHTML = minutes + ":" + remainingSeconds;
if (seconds == 0) {
clearInterval(countdownTimer);
document.getElementById('countdown').innerHTML = "Buzz Buzz";
} else {
seconds--;
}
}
var countdownTimer = setInterval('secondPassed()', 1000);
<p id="times"> 2:50</p>
Redirect You In <span id="timeLeft">40</span> secs..
您可以使用
$(window).focus()
和$(window).blur()
事件。
例:
https://jsfiddle.net/72cLu8c0/
我通过以下代码完成了任务,并在我的 php 项目中工作正常。
<script src="http://newnuk.com/newnuk/newnuk/themes/newnuk/assets/js/jquery.min.js"></script>
<script type="text/javascript">
function startTimer(duration, display) {
var timer = duration, minutes, seconds;
var a=duration;
setInterval(function () {
if (window.isActive) {
minutes = parseInt(timer / 60, 10)
seconds = parseInt(timer % 60, 10);
minutes = minutes < 10 ? "0" + minutes : minutes;
seconds = seconds < 10 ? "0" + seconds : seconds;
//interval check and calling function
a=parseInt(a, 10)-1;
if(a==0) {
showpanel();
$('#timer1').hide();
return false;
}
display.text(minutes + ":" + seconds);
if (--timer < 0) {
alert('hi');
timer = duration;
}
}
}, 1000);
}
jQuery(function ($) {
var fiveMinutes =<?php echo $time ;?>,
display = $('#time');
startTimer(fiveMinutes, display);
// use setTimeout() to execute
//setTimeout(showpanel, 181000)
});
$(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 showpanel() {
var dataString = 'adv='+'MTE=';
$.ajax({
type: "POST",
url: baseurl + "advs/viewed_adv/true",
dataType: "json",
data: dataString,
cache: false,
success: function(json) {
if(json.viewed==true)
{
$('#viewed_sucess').show();
$('#timer1').hide();
}
}
});
}
</script>
<div style="font-size:40px; font-weight:bold;" id="timer1"><span id="time" style="color:red;"></span></div>
<?php
$timer_var = 65;
?>
相关文章:
- 如何在窗体打开时从javascript倒计时计时器值中节省时间
- 设置倒计时计时器,IE出现问题
- MobileFirst:在客户端运行计时器作业-最佳选项
- 显示具有服务器端自动时间注销的同步倒计时计时器
- 倒计时计时器应该持续两个php页面
- 在Jquery倒计时计时器上设置每个数字的动画
- 我如何才能确保计时器设置为每天4点半,所以我不会;不用在Javascript中提及某个日期
- 如何禁用窗口.当计时器超时时,打开卸载警报
- 在Nodejs中为许多用户处理计时器
- 如果弹出窗口关闭,Javascript停止/重置计时器
- 如何在隐藏时暂停jquery计时器
- Javascript倒计时计时器倒计时未正确更新秒/分钟
- 计时器循环从不运行
- AngularJS$inject-点和括号访问器之间的差异
- Progressbar计时器,仅在页面刷新时重新加载
- 日期和unix时间之间的时间,以及计时器倒计时
- 如何使用计时器在图像之间切换?(设置间隔)
- 在浏览器中的选项卡之间切换时停止计时器
- 在使用JQuery倒计时计时器时处理JavaScript和php之间的差异'
- 我应该如何最好地跟踪页面请求之间的计时器