2015-10-16 49 views
0

我正在为我的网站倒计时工作。我们在每天16:00之前提供当天发货。我需要一个计数器,每天倒数到16点。最终,我会修改代码,使其在周末根本不显示,但现在,我需要的是每天都可以倒计时的东西。 16:00后消失,并从00:00开始重新开始倒计时如何在16:00每天晚上重设我的倒计时

以下是我目前使用的代码。

<?php 
if (new DateTime() < new DateTime("16:00:00")) { 

?> 
<script type="text/javascript"> 

    var CDown = function() { 
     this.state=0;// if initialized 
     this.counts=[];// array holding countdown date objects and id to print to {d:new Date(2013,11,18,18,54,36), id:"countbox1"} 
     this.interval=null;// setInterval object 
    } 

    CDown.prototype = { 
     init: function(){ 
      this.state=1; 
      var self=this; 
      this.interval=window.setInterval(function(){self.tick();}, 1000); 
     }, 
     add: function(date,id){ 
      this.counts.push({d:date,id:id}); 
      this.tick(); 
      if(this.state==0) this.init(); 
     }, 
     expire: function(idxs){ 
      for(var x in idxs) { 
      this.display(this.counts[idxs[x]], "Now!"); 
      this.counts.splice(idxs[x], 1); 
     } 
    }, 
    format: function(r){ 
     var out=""; 
     if(r.d != 0){out += r.d +" "+((r.d==1)?"day":"days")+", ";} 
     if(r.h != 0){out += r.h +" "+((r.h==1)?"hour":"hours")+", ";} 
     out += r.m +" "+((r.m==1)?"min":"mins")+", "; 
     out += r.s +" "+((r.s==1)?"sec":"secs")+", "; 

     return out.substr(0,out.length-2); 
    }, 
    math: function(work){ 
     var y=w=d=h=m=s=ms=0; 

     ms=(""+((work%1000)+1000)).substr(1,3); 
     work=Math.floor(work/1000);//kill the "milliseconds" so just secs 

     y=Math.floor(work/31536000);//years (no leapyear support) 
     w=Math.floor(work/604800);//weeks 
     d=Math.floor(work/86400);//days 
     work=work%86400; 

     h=Math.floor(work/3600);//hours 
     work=work%3600; 

     m=Math.floor(work/60);//minutes 
     work=work%60; 

     s=Math.floor(work);//seconds 

     return {y:y,w:w,d:d,h:h,m:m,s:s,ms:ms}; 
    }, 
    tick: function(){ 
     var now=(new Date()).getTime(), 
     expired=[],cnt=0,amount=0; 

     if(this.counts) 
      for(var idx=0,n=this.counts.length; idx<n; ++idx){ 
       cnt=this.counts[idx]; 
       amount=cnt.d.getTime()-now;//calc milliseconds between dates 

       // if time is already past 
       if(amount<0){ 
        expired.push(idx); 
       } 
       // date is still good 
       else{ 
        this.display(cnt, this.format(this.math(amount))); 
       } 
      } 

      // deal with any expired 
      if(expired.length>0) this.expire(expired); 

      // if no active counts, stop updating 
      if(this.counts.length==0) window.clearTimeout(this.interval); 

     }, 
     display: function(cnt,msg){ 
      document.getElementById(cnt.id).innerHTML=msg; 
     } 
    }; 

    window.onload=function(){ 
     var cdown = new CDown(); 

     cdown.add(new Date(2015,9,16,16,00,00), "countbox1"); 
    }; 
</script> 
<span style="font-size:30px;"><div id="countbox1"></div></span> 
<?php } ?> 
+0

我很抱歉,我不能格式这个正确的,我也不认为它已经粘贴了所有的。我将这个文件放在一个在线文件中并快速分享 –

+0

你的问题在于你必须一直保持打开特定的浏览器标签,因为如果有人关闭浏览器等时间间隔将停止计数。我通常使用一个批次文件重新打开页面,然后使用标准任务计划程序每天运行批处理文件。 – Shilly

+0

为了确保网页访问者看到正确的时间,请使用PHP来计算剩余时间,并将其提供给JavaScript代码(作为函数参数)。否则,访客将根据他们的本地机器时钟(可能与您的公司时钟不同几分钟或几小时)看到一个时间。如果你这样做,确保页面不会被缓存,否则访问者会看到一个过时的剩余时间。 – Bobulous

回答

-2

您可以使用一个cron job将每24小时重置一次变量。

+0

我真的不知道从哪里开始 –

+0

PHP和JavaScript都可用,cron作业和系统变量对于此目的完全没有必要。 – Bobulous

+0

该脚本可以控制此功能,并且不需要cron作业 –

0

概念在这里测试 变量countDownTo更改为当前小时线8,103和109 变化对行的变量分钟133

<?php if (new DateTime() < new DateTime("16:00:00")) { ?> 
 
<script type="text/javascript"> 
 
    var check = 0; 
 
    /*set the countdown hour*/ 
 
    var countDownTo = 16; 
 
    var CDown = function() { 
 
    this.state = 0; // if initialized 
 
    this.counts = []; // array holding countdown date objects and id to print to {d:new Date(2013,11,18,18,54,36), id:"countbox1"} 
 
    this.interval = null; // setInterval object 
 
    } 
 

 
    CDown.prototype = { 
 
    init: function() { 
 
     this.state = 1; 
 
     var self = this; 
 
     this.interval = window.setInterval(function() { 
 
     self.tick(); 
 
     }, 1000); 
 
    }, 
 
    add: function(date, id) { 
 
     this.counts.push({ 
 
     d: date, 
 
     id: id 
 
     }); 
 
     this.tick(); 
 
     if (this.state == 0) this.init(); 
 
    }, 
 
    expire: function(idxs) { 
 
     for (var x in idxs) { 
 
     this.display(this.counts[idxs[x]], "Now!"); 
 
     this.counts.splice(idxs[x], 1); 
 
     } 
 

 
    }, 
 
    format: function(r) { 
 
     var out = ""; 
 
     if (r.d != 0) { 
 
     out += r.d + " " + ((r.d == 1) ? "day" : "days") + ", "; 
 
     } 
 
     if (r.h != 0) { 
 
     out += r.h + " " + ((r.h == 1) ? "hour" : "hours") + ", "; 
 
     } 
 
     out += r.m + " " + ((r.m == 1) ? "min" : "mins") + ", "; 
 
     out += r.s + " " + ((r.s == 1) ? "sec" : "secs") + ", "; 
 

 
     return out.substr(0, out.length - 2); 
 
    }, 
 
    math: function(work) { 
 
     var y = w = d = h = m = s = ms = 0; 
 

 
     ms = ("" + ((work % 1000) + 1000)).substr(1, 3); 
 
     work = Math.floor(work/1000); //kill the "milliseconds" so just secs 
 

 
     y = Math.floor(work/31536000); //years (no leapyear support) 
 
     w = Math.floor(work/604800); //weeks 
 
     d = Math.floor(work/86400); //days 
 
     work = work % 86400; 
 

 
     h = Math.floor(work/3600); //hours 
 
     work = work % 3600; 
 

 
     m = Math.floor(work/60); //minutes 
 
     work = work % 60; 
 

 
     s = Math.floor(work); //seconds 
 

 

 

 
     return { 
 
     y: y, 
 
     w: w, 
 
     d: d, 
 
     h: h, 
 
     m: m, 
 
     s: s, 
 
     ms: ms 
 
     }; 
 
    }, 
 
    tick: function() { 
 
     var now = (new Date()).getTime(), 
 
     expired = [], 
 
     cnt = 0, 
 
     amount = 0; 
 

 
     if (this.counts) 
 
     for (var idx = 0, n = this.counts.length; idx < n; ++idx) { 
 
      cnt = this.counts[idx]; 
 
      amount = cnt.d.getTime() - now; //calc milliseconds between dates 
 

 
      // if time is already past 
 
      if (amount < 0) { 
 
      expired.push(idx); 
 
      } 
 
      // date is still good 
 
      else { 
 
      this.display(cnt, this.format(this.math(amount))); 
 
      } 
 
     } 
 

 
     // deal with any expired 
 
     if (expired.length > 0) this.expire(expired); 
 

 
     // if no active counts, stop updating 
 
     if (this.counts.length == 0) window.clearTimeout(this.interval); 
 

 
    }, 
 
    display: function(cnt, msg) { 
 
     if (msg == `Now!`) { 
 
     check = 1; 
 
     msg = ``; 
 
     var cdown = new CDown(); 
 
     var currentdate = new Date(); 
 
     var year = currentdate.getFullYear(); 
 
     var month = currentdate.getMonth(); 
 
     var day = currentdate.getDate() + 1; 
 
     var currenthour = currentdate.getHours(); 
 
     /*perform check here*/ 
 
     if (countDownTo == 16) { 
 
      countDownTo = 0; 
 
     } else { 
 
      countDownTo = 16; 
 
     } 
 
     var hour = countDownTo; 
 
     var minute = 0; 
 
     var second = 0; 
 
     cdown.add(new Date(year, month, day, hour, minute, second), "countbox1"); 
 
     } else { 
 
     check = 0; 
 
     } 
 
     if (countDownTo == 0) msg = ``; 
 
     document.getElementById(cnt.id).innerHTML = msg; 
 

 

 
    } 
 
    }; 
 

 
    window.onload = function() { 
 
    var cdown = new CDown(); 
 
    var currentdate = new Date(); 
 
    var year = currentdate.getFullYear(); 
 
    var month = currentdate.getMonth(); 
 
    var day = currentdate.getDate(); 
 
    var hour = countDownTo; 
 
    var minute = 0; 
 
    var second = 0; 
 
    cdown.add(new Date(year, month, day, hour, minute, second), "countbox1"); 
 
    }; 
 
</script> 
 
<span style="font-size:30px;"><div id="countbox1"></div></span> 
 
<?php } ?>