gpt4 book ai didi

javascript - 如何在倒计时结束后阻止倒计时计时器自行刷新

转载 作者:行者123 更新时间:2023-11-30 13:47:45 25 4
gpt4 key购买 nike

在你们都仓促下结论之前,不,我不希望我的倒数计时器在每次页面刷新后停止自行重置。我已经通过搜索使用 cookie 的解决方案来处理该部分。但是,在我的倒计时结束后,即到达 00:00:00 后,它会从 23:59:59 重新开始。

我知道这是一个逻辑错误,因此我无法找到任何合适的解决方案。这是代码,倒计时为 1 分钟:

<html>
<body>
<div id="hms">00:01:00</div>
</body>

<script>
var startTime;
function getCookie(name) {
var value = "; " + document.cookie;
var parts = value.split("; " + name + "=");
if (parts.length == 2) return parts.pop().split(";").shift();
} // credits kirlich @http://stackoverflow.com/questions/10730362/get-cookie-by-name

function count() {
if(typeof getCookie('remaining')!= 'undefined')
{
startTime = getCookie('remaining');
}
else if(document.getElementById('hms').innerHTML.trim()!='')
{
startTime = document.getElementById('hms').innerHTML;
}
else
{
var d = new Date();
var h=d.getHours();
var m=d.getMinutes();
var s=d.getSeconds();
startTime = h+':'+m+':'+s;
//OR
startTime = d.toTimeString().split(" ")[0]
}

var pieces = startTime.split(":");
var time = new Date();
time.setHours(pieces[0]);
time.setMinutes(pieces[1]);
time.setSeconds(pieces[2]);
var timediff = new Date(time.valueOf()-1000)
var newtime = timediff.toTimeString().split(" ")[0];
document.getElementById('hms').innerHTML=newtime ;
document.cookie = "remaining="+newtime;
setTimeout(count,1000);
}
count();
</script>

</html>

到达 00:00:00 后,计时器重新开始计时。所有帮助将不胜感激! :)

最佳答案

var fiveSeconds = new Date().getTime() + 5000;
$('#spanTimer').countdown(fiveSeconds)
// removed the elapsed: true
.on('update.countdown', function(event) {
var $this = $(this);
if (event.elapsed) {
$this.html(event.strftime('After end: <span>%H:%M:%S</span>'));
} else {
$this.html(event.strftime('To end: <span>%H:%M:%S</span>'));
}
})
// added a finish.countdown callback, to
// hide the countdown altogether and
// have a little fun.
.on('finish.countdown', function(){
$(this).hide();
$("#boomRoom").show();
});
#boomRoom {
display:none;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.countdown/2.2.0/jquery.countdown.js"></script>

<div id="spanTimer">
</div>
<div id="boomRoom">
<img src="http://bestanimations.com/Military/Explosions/atomic-mushroom-cloud-explosion-2-2.gif"/>
</div>

关于javascript - 如何在倒计时结束后阻止倒计时计时器自行刷新,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58951205/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com