如何解决如何在倒计时工作时停止jquery事件
我几乎不了解jquery。我正在尝试进行倒数计时,因此在搜索后我发现了以下代码。
function startTimer(duration,display) {
var timer = duration,minutes,seconds;
setInterval(function () {
minutes = parseInt(timer / 60,10)
seconds = parseInt(timer % 60,10);
minutes = minutes < 10 ? "0" + minutes : minutes;
seconds = seconds < 10 ? "0" + seconds : seconds;
display.textContent = minutes + ":" + seconds;
if (--timer < 0) {
timer = duration;
}
},1000);
}
$('.start').on('click',function(){
var oneMinute = 60 * 1,display = document.querySelector('#time');
startTimer(oneMinute,display);
})
但倒计时在一分钟后重复。就像03、02、01一样,它再次以59开始。
如何阻止它?
我想在给定的分钟后提醒消息并停止计时器。
解决方法
您需要存储间隔ID并使用clearInterval(intervalId);
停止它。
function startTimer(duration,display) {
var timer = duration,minutes,seconds;
var intervalId = setInterval(function () {
minutes = parseInt(timer / 60,10)
seconds = parseInt(timer % 60,10);
minutes = minutes < 10 ? "0" + minutes : minutes;
seconds = seconds < 10 ? "0" + seconds : seconds;
display.textContent = minutes + ":" + seconds;
if (--timer < 0) {
clearInterval(intervalId);
}
},1000);
}
$('.start').on('click',function(){
var oneMinute = 60 * 1,display = document.querySelector('#time');
startTimer(oneMinute,display);
})
,
setInterval
函数返回一个标识符。将间隔ID存储在变量中。这样,您可以在需要时使用clearInterval()
取消间隔。
function startTimer(duration,seconds;
var interval = setInterval(function () {
minutes = parseInt(timer / 60,10);
minutes = minutes < 10 ? "0" + minutes : minutes;
seconds = seconds < 10 ? "0" + seconds : seconds;
display.textContent = minutes + ":" + seconds;
if (--timer < 0) {
clearInterval(interval);
}
},1000);
}
$('.start').on('click',function(){
var oneMinute = 5 * 1,// 5 Seconds for easy testing
display = document.querySelector('#time');
startTimer(oneMinute,display);
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="time">
00:00
</div>
<button type="button" class="start">
START
</button>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。