JavaScript的jQuery倒计时计时器

我想创建一个简单的倒数计时器的日期/时间。JavaScript的jQuery倒计时计时器

我目前只具备以下天就要脚本是工作的罚款：

<div id="countdown"> 

today = new Date(); 
BigDay = new Date("March 29, 2013"); 
msPerDay = 24 * 60 * 60 * 1000 ; 
timeLeft = (BigDay.getTime() - today.getTime()); 
e_daysLeft = timeLeft/msPerDay; 
daysLeft = Math.floor(e_daysLeft); 
document.write(daysLeft + " days to go!"); 

</div>

我现在正试图创建一个完整的倒数计时器（以小时，分钟和秒），并创建了以下脚本。 html没有显示在页面上。

var today = new Date(); 
var BigDay = new Date("29 03 2013, 14:30:00"); 
var msPerDay = 24 * 60 * 60 * 1000 ; 
var timeLeft = (BigDay.getTime() - today.getTime()); 
var e_daysLeft = timeLeft/msPerDay; 
var daysLeft = Math.floor(e_daysLeft); 
var e_hrsLeft = (e_daysLeft - daysLeft)*24; 
var hrsLeft = Math.floor(e_hrsLeft); 
var e_minsLeft = (e_hrsLeft - hrsLeft)*60; 
var minsLeft = Math.floor(e_minsLeft); 
var e_secsLeft = (e_minsLeft - minsLeft)*1000; 
var secsLeft = Math.floor(e_secsLeft); 
var timeString = daysLeft + " : " + hrsLeft + " : " + minsLeft + " : " + secsLeft; 

$('document').ready(function(){ 

window.setInterval(function(){ 
$('#countdown').html(timeString); 
}, 1000); 

});

我不确定问题可能是什么。第一个脚本包含在html中，第二个脚本是外部js文件。

编辑：html现在显示，但是所有值都显示为NaN。

来源

2013-03-14 Razzildinho

BTW，有一个在VAR minsLeft = Math.floor（（e_minsLeft）的额外开括号;什么是您的控制台说 – isotrope 2013-03-14 14:53:15

这提高了它现在它显示HTML，但值分别显示为NaN – Razzildinho 2013-03-14 14:55:26

除了上述语法错误之外，还有逻辑错误，您需要计算超时函数内的剩余时间字符串，否则这些值仅在页面加载时计算。

$(function(){ 
    var BigDay = new Date("29 Mar 2013, 14:30:00"); 
    var msPerDay = 24 * 60 * 60 * 1000 ; 


    window.setInterval(function(){ 
     var today = new Date(); 
     var timeLeft = (BigDay.getTime() - today.getTime()); 

     var e_daysLeft = timeLeft/msPerDay; 
     var daysLeft = Math.floor(e_daysLeft); 

     var e_hrsLeft = (e_daysLeft - daysLeft)*24; 
     var hrsLeft = Math.floor(e_hrsLeft); 

     var e_minsLeft = (e_hrsLeft - hrsLeft)*60; 
     var minsLeft = Math.floor(e_minsLeft); 

     var e_secsLeft = (e_minsLeft - minsLeft)*60; 
     var secsLeft = Math.floor(e_secsLeft); 


     var timeString = daysLeft + " : " + hrsLeft + " : " + minsLeft + " : " + secsLeft; 
     $('#countdown').html(timeString); 
    }, 1000); 
})

演示：？Fiddle

来源

2013-03-14 14:59:21

完美谢谢 – Razzildinho 2013-03-14 15:03:30

是的，你需要计算setInterval里面的时间 – 2013-03-14 15:04:05

还有另外一个问题，秒计算，你使用'（e_minsLeft - minsLeft）* 1000'实际上它应该是'（e_minsLeft - minsLeft）* 60' – 2013-03-14 15:05:11

您这里有一个错误：var minsLeft = Math.floor((e_minsLeft);

第一个括号未闭合，应var minsLeft = Math.floor(e_minsLeft);

来源

2013-03-14 14:53:25 couzzi

固定谢谢 – Razzildinho 2013-03-14 14:58:02

因为你没有运行TIMESTRING计算每一秒让你#countdown格中的文本会永不改变

来源

2013-03-14 14:53:57 xManh

所以整个功能需要在setInterval内吗 – Razzildinho 2013-03-14 14:57:38

JavaScript的jQuery倒计时计时器

回答

相关问题