---

点击地址查看事例：http://static.hebinghua.com/sucai/anniversary.html

源代码：
<div style="background:rgb(183,17,41); width: 100%; color:#fff;text-align: center;">
    <P style="font-size:.8em;line-height:2em;">10s挑战：</P>
    <div id="fnTimeCountDown" data-end="2018/11/08 18:45:13">
        <span id="anniversary-time-1">0</span>
        <span  id="anniversary-time-2">0</span>
        <span >.</span>
        <span  id="anniversary-time-3">0</span>
        <span  id="anniversary-time-4">0</span>
        <span  id="anniversary-time-5">0</span>
    </div>
        <input type="button" value="开始"  data-type="1" id="gostarttime">
    <input type="button" value="重置" onclick="reserttime()">
</div>

<script type="text/javascript">
var ref='';
   // $("#fnTimeCountDown").fnTimeCountDown("2018/07/08 18:45:13");
    $('#gostarttime').on('click',function(){
   // $('#fnTimeCountDown').end(new Date());
    var type = $(this).data('type');
    if (type == 1) {
     $("#fnTimeCountDown").fnTimeCountDown(new Date());
        $(this).val('停止');
        $(this).data('type',0)
    } else {
        stoptime()
    }
})
    function stoptime(){
        clearInterval(ref);
    }
        function reserttime(){
        $("#anniversary-time-1").text(0);
        $("#anniversary-time-2").text(0);
        $("#anniversary-time-3").text(0);
        $("#anniversary-time-4").text(0);
        $("#anniversary-time-5").text(0);
        $('#gostarttime').data('type',1)
        $('#gostarttime').val('开始');
        clearInterval(ref);
    }
</script>
<script type="text/javascript">
    $.extend($.fn,{
        fnTimeCountDown:function(d){
            this.each(function(){
                var $this = $(this);
                var o = {
                    time1: $this.find("#anniversary-time-1"),
                    time2: $this.find("#anniversary-time-2"),
                    time3: $this.find("#anniversary-time-3"),
                    time4: $this.find("#anniversary-time-4"),
                    time5: $this.find("#anniversary-time-5"),
                };
                var f = {
                    haomiao: function(n){
                        if(n < 10)return "00" + n.toString();
                        if(n < 100)return "0" + n.toString();
                        return n.toString();
                    },
                    zero: function(n){
                        var _n = parseInt(n, 10);//解析字符串,返回整数
                        if(_n > 0){
                            if(_n <= 9){
                                _n = "0" + _n
                            }
                            return String(_n);
                        }else{
                            return "00";
                        }
                    },
                    dv: function(){
                        var _d = d;
                        var now = new Date(),
                            endDate = new Date(_d);
                        //现在将来秒差值
                        var dur = (now.getTime()-endDate) / 1000 , mss =now.getTime()- endDate ,pms = {
                            time1:"0",
                            time2:"0",
                            time3:"0",
                            time4:"0",
                            time5:"0",
                        };
                        if(mss > 0){
                          var  temp1=f.haomiao(mss % 1000),temp2=f.zero(dur % 60);
                            pms.time5 = temp1.substring(2,3);
                            pms.time4 = temp1.substring(1,2);
                            pms.time3 = temp1.substring(0,1);
                            pms.time2 = temp2.substring(1,2);
                            pms.time1 = temp2.substring(0,1);
                        }
                        return pms;
                    },
                    ui: function(){
                        if(o.time1){
                            o.time1.html(f.dv().time1);
                        }
                        if(o.time2){
                            o.time2.html(f.dv().time2);
                        }
                        if(o.time3){
                            o.time3.html(f.dv().time3);
                        }
                        if(o.time4){
                            o.time4.html(f.dv().time4);
                        }
                        if(o.time5){
                            o.time5.html(f.dv().time5);
                        }
                       ref=setTimeout(f.ui, 1);
                    }
                };
                f.ui();
            });
        }
    });
</script>

---

    出自：何冰华个人网站

    地址：https://www.hebinghua.com/

    转载请注明出处