var startTime = $("#sendTime #time").html().split("-"); var stopTime = $("#stopTime #time").html().split("-"); var start0 = startTime[0], start1 = startTime[1], start2 = startTime[2]; var stop0 = stopTime[0], stop1 = stopTime[1], stop2 = parseInt(stopTime[2]) + 1; var day1 = new Date(start0, start1 - 1, start2).getTime(); var day2 = new Date(stop0, stop1 - 1, stop2).getTime(); var today = new Date(); var ms, dt; ms = day2 - today; dt = Math.ceil(ms / 1000 / 3600 / 24); if (ms > 0) { $("#last").html("(剩余约" + dt + "天)"); } else if (ms == 0) { $("#last").html("(剩余约" + 1 + "天)"); } else { $("#last").html("(已过期)"); }
一个封装好的时间倒计时,两个时间戳可以做
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>倒计时</title> </head> <body> <script> function countDown( maxtime,fn ) { var timer = setInterval(function() { if(maxtime>=0){ d=parseInt(maxtime/3600/24); h=parseInt((maxtime/3600)%24); minutes=parseInt((maxtime/60)%60); seconds=parseInt(maxtime%60); //minutes = Math.floor(maxtime/60); //seconds = Math.floor(maxtime%60); msg = "距离结束还有"+d+"天"+h+"小时"+minutes+"分"+seconds+"秒"; fn(msg); if(maxtime == 5*60) alert('注意,还有5分钟!'); --maxtime; } else{ clearInterval( timer ); fn("时间到,结束!"); } }, 1000); } </script> <div id="timer1" style="color:red"></div> <script> countDown( 6000,function( msg ) //6000服务器时间差 单位为妙 { document.getElementById('timer1').innerHTML = msg; }); </script> <div id="timer2" style="color:red"></div> <script> countDown( 6000,function( msg ) { document.getElementById('timer2').innerHTML = msg; }); </script> <div id="timer3" style="color:red"></div> <script> countDown( 600000,function( msg ) { document.getElementById('timer2').innerHTML = msg; }); countDown(20,function( msg ) { document.getElementById('timer3').innerHTML = msg; }) </script> </body> </html>
关于时间倒计时, 用法原理是这样的。 选把时间换算, 再用定时器每次 获取计算就行了。
看下面的例子。
<!doctype html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0,user-scalable=no"> <meta http-equiv="Cache-Control" content="max-age=0"> <meta name="apple-touch-fullscreen" content="yes"> <meta name="apple-mobile-web-app-capable" content="yes"> <meta name="apple-mobile-web-app-status-bar-style" content="black"> <meta name="apple-mobile-web-app-capable" content="yes"> <meta name="apple-mobile-web-app-status-bar-style" content="black"> <meta content="telephone=no" name="format-detection" /> <meta name="apple-mobile-web-app-capable" content="yes"> <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" /> <title>倒计时</title> </head> <body> <div id="time" residue_time = "1473315993" >000</div> </body> </html> <script type="text/javascript" src="jquery.1.9.0.min.js"></script> <script type="text/javascript"> $(function(){ time.init(); }) var time = { init : function(){ this.timer= null; this.bindEvent(); }, bindEvent:function(){ var _this = this; var ms = parseInt($("#time").attr("residue_time")); $("#time").text(_this.convertMS(ms)); this.timer = setInterval(function(){ var ms = parseInt($("#time").attr("residue_time")); var showtimes = _this.convertMS(ms); $("#time").text(showtimes).attr("residue_time", ms - 1000); },1000) }, // 转换毫秒 convertMS:function(ms) { if (ms < 1000) return "价格已过期"; var hours = parseInt(ms / 1000 / 60 / 60 % 24); /*if (hours > 0) return 0;*/ var minites = parseInt(ms / 1000 / 60 % 60); var seconds = parseInt(ms / 1000 % 60); minites = minites < 10 ? "0" + minites : minites; seconds = seconds < 10 ? "0" + seconds : seconds; return "剩余" + minites + "分" + seconds + "秒" }, // 转换小时24小时制返回小时 convertMS24 : function(ms) { if (ms < 1000) return 0; var dt1 = new Date(Number(ms)); var day = dt1.getDate(); var hours = dt1.getHours(); var minites = dt1.getMinutes(); var seconds = dt1.getSeconds(); minites = minites < 10 ? "0" + minites : minites; seconds = seconds < 10 ? "0" + seconds : seconds; if (hours > 0){ return hours+"到点了"; } }, } </script>