活动倒计时代码（精确到毫秒）jquery插件

  1 <script type="text/javascript" src="http://lib.sinaapp.com/js/jquery/1.9.1/jquery-1.9.1.min.js"></script>
  2 <script type="text/javascript">
  3     $.extend($.fn,{
  4        
  5         fnTimeCountDown:function(d){
  6             this.each(function(){
  7                 var $this = $(this);
  8                 var o = {
  9                     hm: $this.find(".hm"),
 10                     sec: $this.find(".sec"),
 11                     mini: $this.find(".mini"),
 12                     hour: $this.find(".hour"),
 13                     day: $this.find(".day"),
 14                     month:$this.find(".month"),
 15                     year: $this.find(".year")
 16                 };
 17                 var f = {
 18                     haomiao: function(n){
 19                         if(n < 10)return "00" + n.toString();
 20                         if(n < 100)return "0" + n.toString();
 21                         return n.toString();
 22                     },
 23                     zero: function(n){
 24                         var _n = parseInt(n, 10);//解析字符串,返回整数
 25                         if(_n > 0){
 26                             if(_n <= 9){
 27                                 _n = "0" + _n
 28                             }
 29                             return String(_n);
 30                         }else{
 31                             return "00";
 32                         }
 33                     },
 34                     dv: function(){
 35                         //d = d || Date.UTC(2050, 0, 1); //如果未定义时间，则我们设定倒计时日期是2050年1月1日
 36                         var _d = $this.data("end") || d;
 37                         var now = new Date(),
 38                             endDate = new Date(_d);
 39                         //现在将来秒差值
 40                         //alert(future.getTimezoneOffset());
 41                         var dur = (endDate - now.getTime()) / 1000 , mss = endDate - now.getTime() ,pms = {
 42                             hm:"000",
 43                             sec: "00",
 44                             mini: "00",
 45                             hour: "00",
 46                             day: "00",
 47                             month: "00",
 48                             year: "0"
 49                         };
 50                         if(mss > 0){
 51                             pms.hm = f.haomiao(mss % 1000);
 52                             pms.sec = f.zero(dur % 60);
 53                             pms.mini = Math.floor((dur / 60)) > 0? f.zero(Math.floor((dur / 60)) % 60) : "00";
 54                             pms.hour = Math.floor((dur / 3600)) > 0? f.zero(Math.floor((dur / 3600)) % 24) : "00";
 55                             pms.day = Math.floor((dur / 86400)) > 0? f.zero(Math.floor((dur / 86400)) % 30) : "00";
 56                             //月份，以实际平均每月秒数计算
 57                             pms.month = Math.floor((dur / 2629744)) > 0? f.zero(Math.floor((dur / 2629744)) % 12) : "00";
 58                             //年份，按按回归年365天5时48分46秒算
 59                             pms.year = Math.floor((dur / 31556926)) > 0? Math.floor((dur / 31556926)) : "0";
 60                         }else{
 61                             pms.year=pms.month=pms.day=pms.hour=pms.mini=pms.sec="00";
 62                             pms.hm = "000";
 63                             //alert('结束了');
 64                             return;
 65                         }
 66                         return pms;
 67                     },
 68                     ui: function(){
 69                         if(o.hm){
 70                             o.hm.html(f.dv().hm);
 71                         }
 72                         if(o.sec){
 73                             o.sec.html(f.dv().sec);
 74                         }
 75                         if(o.mini){
 76                             o.mini.html(f.dv().mini);
 77                         }
 78                         if(o.hour){
 79                             o.hour.html(f.dv().hour);
 80                         }
 81                         if(o.day){
 82                             o.day.html(f.dv().day);
 83                         }
 84                         if(o.month){
 85                             o.month.html(f.dv().month);
 86                         }
 87                         if(o.year){
 88                             o.year.html(f.dv().year);
 89                         }
 90                         setTimeout(f.ui, 1);
 91                     }
 92                 };
 93                 f.ui();
 94             });
 95         }
 96     });
 97 </script>
 98 
 99 <div style="background:rgb(183,17,41);  WIDTH: 100%;  color:#fff;FONT-FAMILY: arial; TEXT-ALIGN: center;">
100     <P style="font-size:.8em;line-height:2em;">距活动结束还有：</P>
101     <div id="fnTimeCountDown" data-end="2018/07/08 18:45:13">
102         <span class="year">00</span>年
103         <span class="month">00</span>月
104         <span class="day">00</span>天
105         <span class="hour">00</span>时
106         <span class="mini">00</span>分
107         <span class="sec">00</span>秒
108         <span class="hm">000</span>
109     </div>
110 </div>
111 <script type="text/javascript">
112     $("#fnTimeCountDown").fnTimeCountDown("2018/07/08 18:45:13");
113 </script>

活动倒计时代码可以精确到毫秒已经使用jquery插件化，方便调用和同一个页面重复调用。插件调用代码： $("#fnTimeCountDown").fnTimeCountDown("2018/07/08 18:45:13");

活动倒计时代码可以精确到毫秒已经使用jquery插件化，方便调用和同一个页面重复调用。
html结构如：

<span class="year">00</span>年

<span class="month">00</span>月

<span class="day">00</span>天

<span class="hour">00</span>时

<span class="mini">00</span>分

<span class="sec">00</span>秒

</div>
插件调用代码： $("#fnTimeCountDown").fnTimeCountDown("2018/07/08 18:45:13");

如果一个页面同时调用多个倒计时也很简单，比如相同地方有一个相同类名：fnTimeCountDown 我们就可以使用这个类名调用即可$(".fnTimeCountDown").fnTimeCountDown("2018/07/08 18:45:13");

在扩展一下，你想给每一个倒计时设置不同的倒计时时间，这个也可以，很简单在要显示倒计时时间的标签上写上 data-end="2018/07/08 18:45:13" 而且这个优先级是比较高的。所以你可以不传日期，直接使用data-end="2018/07/08 18:45:13" 这种方式设定日期。
如：<div class="fnTimeCountDown" data-end="2018/07/08 18:45:13">......</div>
这样子。