无法清除间隔
Not being able to clearInterval
我是这里和 Javascript 的新人。
我正在创建一个计时器,它将显示距离特定日期和时间还有多少天、小时、分钟、秒。
我成功地对此进行了编程,但这是一个我无法解决的问题。
当到达特定日期和时间时,计时器显示还剩 0 天 0 小时 0 分钟 0 秒。但就在那之后,这些值变为负值。我不想显示负值,这就是为什么我使用 clearInterval 停止每秒更新 DOM 但它不起作用的原因。这是我的代码...
function init()
{
.
.
.
var timeCalc = setInterval(timeRemainingCalc, 1000);
}
var launchTime = new Date("05/28/2015 00:56:00").getTime(); //here goes a particular date and time
function timeRemainingCalc() {
var currentTime = new Date(); //this gets client's date and time
var daysleft = Math.floor(((launchTime - currentTime.getTime()) / 1000) / 86400);
var hoursleft = Math.floor(((launchTime - currentTime.getTime()) / 1000) / 3600) - daysleft * 24;
var minutesleft = Math.floor(((launchTime - currentTime.getTime()) / 1000) / 60) - daysleft * 24 * 60 - hoursleft * 60;
var secondsleft = Math.floor((launchTime - currentTime.getTime()) / 1000) - daysleft * 24 * 60 * 60 - hoursleft * 60 * 60 - minutesleft * 60;
if (daysleft <= 0 && hoursleft <= 0 && minutesleft <= 0 && secondsleft <= 0) //checks if the particular time has already been reached or not? i.e. negative value
{
clearInterval(timeCalc); //this one is not working...
} else //code inside this only updates 1st and 2nd digit of days, hours, etc of the timer
{
document.getElementById('Days0').innerHTML = Math.floor(daysleft / 10);
document.getElementById('Days1').innerHTML = daysleft - Math.floor(daysleft / 10) * 10;
document.getElementById('Hours0').innerHTML = Math.floor(hoursleft / 10);
document.getElementById('Hours1').innerHTML = hoursleft - Math.floor(hoursleft / 10) * 10;
document.getElementById('Minutes0').innerHTML = Math.floor(minutesleft / 10);
document.getElementById('Minutes1').innerHTML = minutesleft - Math.floor(minutesleft / 10) * 10;
document.getElementById('Seconds0').innerHTML = Math.floor(secondsleft / 10);
document.getElementById('Seconds1').innerHTML = secondsleft - Math.floor(secondsleft / 10) * 10;
}
}
我认为HTML代码和CSS代码在这里是不必要的。如果需要的话告诉我我也会上传。
谢谢。
嗯,您的代码永远不会调用 clearInterval
,除非时间恰好是 launchTime
。
Fiddle 与此修改版本的 launchTime
值,您将看到:
var timeCalc = setInterval(timeRemainingCalc, 1000);
var launchTime = new Date("01/01/2015 00:01:00").getTime(); //here goes a particular date and time
function timeRemainingCalc() {
var currentTime = new Date(); //this gets client's date and time
var daysleft = Math.floor(((launchTime - currentTime.getTime()) / 1000) / 86400);
var hoursleft = Math.floor(((launchTime - currentTime.getTime()) / 1000) / 3600) - daysleft * 24;
var minutesleft = Math.floor(((launchTime - currentTime.getTime()) / 1000) / 60) - daysleft * 24 * 60 - hoursleft * 60;
var secondsleft = Math.floor((launchTime - currentTime.getTime()) / 1000) - daysleft * 24 * 60 * 60 - hoursleft * 60 * 60 - minutesleft * 60;
if (daysleft <= 0 && hoursleft <= 0 && minutesleft <= 0 && secondsleft <= 0) //checks if the particular time has already been reached or not? i.e. negative value
{
console.log("Clear!");
clearInterval(timeCalc); //this one is not working...
} else //code inside this only updates 1st and 2nd digit of days, hours, etc of the timer
{
console.log("daysleft: " + daysleft);
console.log("hoursleft: " + hoursleft);
console.log("minutesleft: " + minutesleft);
console.log("secondsleft: " + secondsleft);
console.log("");
}
}
jsFiddle - https://jsfiddle.net/o991pkxa/
您应该检查 any 个 days/hours/minutes/secondsleft
变量是否为负数,而不是 all 个是否为负数。
您正在另一个函数范围内定义 timecalc。您无法访问该变量。
最简单的解决方案:执行
var timeCalc;
function init()
{ ...
timeCalc = setInterval(timeRemainingCalc, 1000);
}
让 timeCalc 全球可用。
我是这里和 Javascript 的新人。 我正在创建一个计时器,它将显示距离特定日期和时间还有多少天、小时、分钟、秒。 我成功地对此进行了编程,但这是一个我无法解决的问题。 当到达特定日期和时间时,计时器显示还剩 0 天 0 小时 0 分钟 0 秒。但就在那之后,这些值变为负值。我不想显示负值,这就是为什么我使用 clearInterval 停止每秒更新 DOM 但它不起作用的原因。这是我的代码...
function init()
{
.
.
.
var timeCalc = setInterval(timeRemainingCalc, 1000);
}
var launchTime = new Date("05/28/2015 00:56:00").getTime(); //here goes a particular date and time
function timeRemainingCalc() {
var currentTime = new Date(); //this gets client's date and time
var daysleft = Math.floor(((launchTime - currentTime.getTime()) / 1000) / 86400);
var hoursleft = Math.floor(((launchTime - currentTime.getTime()) / 1000) / 3600) - daysleft * 24;
var minutesleft = Math.floor(((launchTime - currentTime.getTime()) / 1000) / 60) - daysleft * 24 * 60 - hoursleft * 60;
var secondsleft = Math.floor((launchTime - currentTime.getTime()) / 1000) - daysleft * 24 * 60 * 60 - hoursleft * 60 * 60 - minutesleft * 60;
if (daysleft <= 0 && hoursleft <= 0 && minutesleft <= 0 && secondsleft <= 0) //checks if the particular time has already been reached or not? i.e. negative value
{
clearInterval(timeCalc); //this one is not working...
} else //code inside this only updates 1st and 2nd digit of days, hours, etc of the timer
{
document.getElementById('Days0').innerHTML = Math.floor(daysleft / 10);
document.getElementById('Days1').innerHTML = daysleft - Math.floor(daysleft / 10) * 10;
document.getElementById('Hours0').innerHTML = Math.floor(hoursleft / 10);
document.getElementById('Hours1').innerHTML = hoursleft - Math.floor(hoursleft / 10) * 10;
document.getElementById('Minutes0').innerHTML = Math.floor(minutesleft / 10);
document.getElementById('Minutes1').innerHTML = minutesleft - Math.floor(minutesleft / 10) * 10;
document.getElementById('Seconds0').innerHTML = Math.floor(secondsleft / 10);
document.getElementById('Seconds1').innerHTML = secondsleft - Math.floor(secondsleft / 10) * 10;
}
}
我认为HTML代码和CSS代码在这里是不必要的。如果需要的话告诉我我也会上传。
谢谢。
嗯,您的代码永远不会调用 clearInterval
,除非时间恰好是 launchTime
。
Fiddle 与此修改版本的 launchTime
值,您将看到:
var timeCalc = setInterval(timeRemainingCalc, 1000);
var launchTime = new Date("01/01/2015 00:01:00").getTime(); //here goes a particular date and time
function timeRemainingCalc() {
var currentTime = new Date(); //this gets client's date and time
var daysleft = Math.floor(((launchTime - currentTime.getTime()) / 1000) / 86400);
var hoursleft = Math.floor(((launchTime - currentTime.getTime()) / 1000) / 3600) - daysleft * 24;
var minutesleft = Math.floor(((launchTime - currentTime.getTime()) / 1000) / 60) - daysleft * 24 * 60 - hoursleft * 60;
var secondsleft = Math.floor((launchTime - currentTime.getTime()) / 1000) - daysleft * 24 * 60 * 60 - hoursleft * 60 * 60 - minutesleft * 60;
if (daysleft <= 0 && hoursleft <= 0 && minutesleft <= 0 && secondsleft <= 0) //checks if the particular time has already been reached or not? i.e. negative value
{
console.log("Clear!");
clearInterval(timeCalc); //this one is not working...
} else //code inside this only updates 1st and 2nd digit of days, hours, etc of the timer
{
console.log("daysleft: " + daysleft);
console.log("hoursleft: " + hoursleft);
console.log("minutesleft: " + minutesleft);
console.log("secondsleft: " + secondsleft);
console.log("");
}
}
jsFiddle - https://jsfiddle.net/o991pkxa/
您应该检查 any 个 days/hours/minutes/secondsleft
变量是否为负数,而不是 all 个是否为负数。
您正在另一个函数范围内定义 timecalc。您无法访问该变量。
最简单的解决方案:执行
var timeCalc;
function init()
{ ...
timeCalc = setInterval(timeRemainingCalc, 1000);
}
让 timeCalc 全球可用。