您的位置:首页 > Web前端 > JQuery

jquery倒计时

2015-10-10 12:35 525 查看
最近领导安排准备个倒计时,上网找了些插件,都不是很满意,于是自己动手写了个,直接上代码吧。

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 + ',请尽快处理');
}


自己练手的项目,请指正,共同进步。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: