最近领导安排准备个倒计时,上网找了些插件,都不是很满意,于是自己动手写了个,直接上代码吧。
HTML:
<div id="showDiv" class="countDown"> </div>
JS:
var clickt = '2015/10/9 1:10:00'; function countdown(d,clicktime){//d为过期天数,clicktime为后台传过来的点击时间 var clickTime = new Date(clicktime);//此处传入的时间为点击记录时间 var disTime = (new Date()).getTime() - clickTime.getTime(); var valueTime = 24*3600*1000*d; var ts = (valueTime-disTime)/1000;//计算剩余的毫秒数 var dd = parseInt((ts/3600)/24);//计算剩余的天数 var hh = parseInt(ts/3600%24);//计算剩余的小时数 var mm = parseInt((ts/60)%60);//计算剩余的分钟数 var ss = parseInt(ts%60);//计算剩余的秒数 if(clickTime && disTime>0)//点击时间发生在过去 { if(ts > 0){//规定时间内 var htmlsDays = '剩余'+checkTime(dd)+'天' +checkTime(hh)+ '小时' +checkTime(mm)+ '分钟' + checkTime(ss)+ '秒'; var htmlStr = '剩余'+checkTime(hh)+ '小时' +checkTime(mm)+ '分钟' + checkTime(ss)+ '秒'; if(dd>0){ $('.countDown').html(htmlsDays); }else{ $('.countDown').html(htmlStr); } }else{ $('.countDown').html('Sorry,已超过'+d+'天的规定的操作期限,请重新订阅!'); } }else{ $('.countDown').html('error~'); } } function checkTime(i){ if(i<10){ i = '0'+i; } return i; } $(function(){ setInterval('countdown(2,clickt)',1000); })
另外还从其它地方看到一个24小时的倒计时,顺便粘出来,忘了从哪里看到的了,如果有侵权,请联系我删掉。
$(function(){ //点击开始倒计时 $('#click').click(function(){ time=setInterval("run()",1000); }) }) var time; var h=23; var m=59; var s=59; //进行倒计时显示 function run(){ --s; if(s<0){ --m; s=59; } if(m<0){ --h; m=59 } if(h<0){ s=0; m=0; } $('#showDiv').html('您还有' +h+":"+m+":"+s + ',请尽快处理'); }
自己练手的项目,请指正,共同进步。