<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>仿京东秒杀倒计时兼容ie6</title>
<script src="jquery-1.10.1.min.js"></script>
<script>
var limit_time;
if(window.name==""){//查看是否已有记录的时间
limit_time=6000;//设置结束时间,单位秒
}else{
limit_time=window.name;
}
function timeDown(){
if(limit_time>=0){
var day=Math.floor(limit_time/60/60/24); /*划分出时分秒*/
var hour=Math.floor(limit_time/60/60%24);
var minutes=Math.floor(limit_time/60%60);
var seconds=Math.floor(limit_time%60);
$("#t_day").html(day+"天"); /*写到页面中*/
$("#t_hour").html(hour+"时");
$("#t_minute").html(minutes+"分");
$("#t_second").html(seconds+"秒");
if(limit_time==10){
alert("提醒,还有10秒结束");
}
--limit_time;
window.name=limit_time;//记录当前时间。
}
else{clearInterval(timer);
alert("时间到!活动结束");
}
}
timer=setInterval("timeDown()",1000);//设置定时器,1秒钟执行一次timeDown()函数;
</script>
</head>
<body>
<div id="timecon"></div>
<div class="time">
<span>距离本场结束 </span>
<span id="t_day">00天</span>
<span id="t_hour">00时</span>
<span id="t_minute">00分</span>
<span id="t_second">00秒</span>
</div>
</body>
</html>
方法二
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>仿京东秒杀倒计时</title>
<script src="jquery-1.10.1.min.js"></script>
</head>
<body>
<div class="time">
<span>距离本场结束 </span>
<span id="t_day">00天</span>
<span id="t_hour">00时</span>
<span id="t_minute">00分</span>
<span id="t_second">00秒</span>
</div>
<script>
$(function(){
window.setInterval(getTimer,10);/*设置不间断定时器执行getTimer函数*/
})
function getTimer(){
var endtime=new Date("2016/06/08 00:00:00"); /*定义结束时间*/
var nowtime=new Date();/*获取当前时间*/
var cha=endtime.getTime()-nowtime.getTime();/*得到它们相差的时间*/
var day=Math.floor(cha/1000/60/60/24); /*划分出时分秒*/
var hour=Math.floor(cha/1000/60/60%24);
var minute=Math.floor(cha/1000/60%60);
var second=Math.floor(cha/1000%60);
if (minute <= 9) minute = '0' + minute;
if (second <= 9) second = '0' + second;
if (hour <= 9) hour = '0' + hour;
$("#t_day").html(day+"天"); /*写到页面中*/
$("#t_hour").html(hour+"时");
$("#t_minute").html(minute+"分");
$("#t_second").html(second+"秒");
}
</script>
</body>
</html>
效果变形:
<script>
var limit_time;
if(window.name==""){//查看是否已有记录的时间
limit_time=60000;//设置结束时间,单位秒
}else{
limit_time=window.name;
}
function timeDown(){
if(limit_time>=0){
var day=Math.floor(limit_time/60/60/24); /*划分出时分秒*/
var hour=Math.floor(limit_time/60/60%24);
var minutes=Math.floor(limit_time/60%60);
var seconds=Math.floor(limit_time%60);
if (minutes <= 9) minutes = '0' + minutes;
if (seconds <= 9) seconds = '0' + seconds;
if (hour <= 9) hour = '0' + hour;
// $("#t_day").html(day); /*写到页面中*/
var hour_txt=hour+"";
var hour_str01 = hour_txt.substr(0,1);
var hour_str02 = hour_txt.substr(1,2);
var minutes_txt=minutes+"";
var minutes_str01 = minutes_txt.substr(0,1);
var minutes_str02 = minutes_txt.substr(1,2);
var seconds_txt=seconds+"";
var seconds_str01 = seconds_txt.substr(0,1);
var seconds_str02 = seconds_txt.substr(1,2);
$("#t_hour").html('<em>'+hour_str01+'</em>'+'<em>'+hour_str02+'</em>');
$("#t_minute").html('<em>'+minutes_str01+'</em>'+'<em>'+minutes_str02+'</em>');
$("#t_second").html('<em>'+seconds_str01+'</em>'+'<em>'+seconds_str02+'</em>');
--limit_time;
window.name=limit_time;//记录当前时间。
}
else{clearInterval(timer);
}
}
timer=setInterval("timeDown()",1000);//设置定时器,1秒钟执行一次timeDown()函数;
</script>
<div class="time">
<!-- <span id="t_day">00</span> -->
<span id="t_hour"><em>0</em><em>0</em></span>
:
<span id="t_minute"><em>0</em><em>0</em></span>
:
<span id="t_second"><em>0</em><em>0</em></span>
</div>
方法三:获取系统当前时间
<div class="home6box">
<?php
//php的时间是以秒算。js的时间以毫秒算
date_default_timezone_set('PRC');
//date_default_timezone_set("Asia/Hong_Kong");//地区
//配置每天的活动时间段
$starttimestr = "2015-07-05 00:00:00";
$endtimestr = "2015-07-05 24:00:00";
$starttime = strtotime($starttimestr);
$endtime = strtotime($endtimestr);
$nowtime = time();
if ($nowtime<$starttime){
// echo "活动还没开始,活动时间是:{$starttimestr}至{$endtimestr}";
// echo "<div class='act_con'>活动还没开始</div>";
}
if ($endtime>=$nowtime){
$lefttime = $endtime-$nowtime; //实际剩下的时间(秒)
}else{
$lefttime=0;
// echo "<div class='act_con'>活动已经结束!</div>";
}
?>
<?php if($rs['title']!=''){?>
<div class="homebox_head" >
<?php echo $rs['title']; ?>
<script language="JavaScript">
var runtimes = 0;
function GetRTime(){
var nMS = <?php echo $lefttime; ?>*1000-runtimes*1000;
if (nMS>=0){
var nD=Math.floor(nMS/(1000*60*60*24))%24;
var nH=Math.floor(nMS/(1000*60*60))%24;
var nM=Math.floor(nMS/(1000*60)) % 60;
var nS=Math.floor(nMS/1000) % 60;
if (nM <= 9) nM = '0' + nM;
if (nS <= 9) nS = '0' + nS;
if (nH <= 9) nH = '0' + nH;
var hour_txt=nH+"";
var hour_str01 = hour_txt.substr(0,1);
var hour_str02 = hour_txt.substr(1,2);
var minutes_txt=nM+"";
var minutes_str01 = minutes_txt.substr(0,1);
var minutes_str02 = minutes_txt.substr(1,2);
var seconds_txt=nS+"";
var seconds_str01 = seconds_txt.substr(0,1);
var seconds_str02 = seconds_txt.substr(1,2);
$("#t_hour").html('<em>'+hour_str01+'</em>'+'<em>'+hour_str02+'</em>');
$("#t_minute").html('<em>'+minutes_str01+'</em>'+'<em>'+minutes_str02+'</em>');
$("#t_second").html('<em>'+seconds_str01+'</em>'+'<em>'+seconds_str02+'</em>');
$("#t_hour").html('<em>'+hour_str01+'</em>'+'<em>'+hour_str02+'</em>');
$("#t_minute").html('<em>'+minutes_str01+'</em>'+'<em>'+minutes_str02+'</em>');
$("#t_second").html('<em>'+seconds_str01+'</em>'+'<em>'+seconds_str02+'</em>');
// document.getElementById("RemainH").innerHTML=nH;
// document.getElementById("RemainM").innerHTML=nM;
// document.getElementById("RemainS").innerHTML=nS;
if(nMS==5*60*1000)
{
// alert("还有最后五分钟!");
}
runtimes++;
setTimeout("GetRTime()",1000);
}
}
var Num = 0;
onload = function() {
Refresh();
setInterval("Refresh();",100);
GetRTime();
}
function Refresh() {
if (Num<10){
document.getElementById("RemainL").innerHTML = Num;
Num = Num + 1;
}else{
Num=0;
}
}
</script>
<div class="time" style="display:none">
<strong id="RemainH"><em>0</em><em>0</em></strong><strong id="RemainM"><em>0</em><em>0</em></strong> <strong id="RemainS"><em>0</em><em>0</em></strong>.<strong id="RemainL">XX</strong>
</div>
<div class="time" style="display:none">
<span id="t_day">00</span>
<span id="t_hour"><em>0</em><em>0</em></span>:<span id="t_minute"><em>0</em><em>0</em></span>:<span id="t_second"><em>0</em><em>0</em></span>
</div>
</div>
<?php } ?>
</div>