仿京东秒杀倒计时兼容ie6

最新推荐文章于 2024-02-02 15:02:11 发布

吴杼恩

最新推荐文章于 2024-02-02 15:02:11 发布

阅读量4.5k

点赞数 3

分类专栏： jquery 文章标签：仿京东秒杀倒计时兼容ie6 JQ倒计时上传活动倒计时

本文链接：https://blog.csdn.net/qianqianyixiao1/article/details/46411167

版权

jquery 专栏收录该内容

16 篇文章 0 订阅

订阅专栏

<!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>

吴杼恩

关注

3
点赞
踩
4

收藏

觉得还不错? 一键收藏
0
评论
仿京东秒杀倒计时兼容ie6

仿京东秒杀倒计时兼容ie6 var limit_time; if(window.name==""){//查看是否已有记录的时间 limit_time=6000;//设置结束时间，单位秒 }else{ limit_time=window.name; }function timeDown(){ if(limit_time>=0){ var da
复制链接

扫一扫