jQuery倒计时插件

原文:http://www.cnphp6.com/archives/127252

jquery.time.js源码如下(源码来自网络):
(function($){
    $.fn.countDown = function(secs) {
        secs = parseInt(secs);
        var timeId,
            me = $(this),
            HMSObj,
            HMSHtml = '<span><span class="time-border">#HH#</span></span>' +
                '<span>:</span>' +
                '<span><span class="time-border">#MM#</span></span>' +
                '<span>:</span>' +
                '<span><span class="time-border">#SS#</span></span>';
        var timeId = setInterval(function(){
            HMSObj = $.secsToHMS(secs);
            me.html(HMSHtml.replace('#HH#', HMSObj.H).replace('#MM#', HMSObj.M).replace('#SS#', HMSObj.S));
            secs--;
            if(secs < 0) {
                clearInterval(timeId);
            }
        }, 1000);

    };
    $.extend({
        secsToHMS : function(secs) {
            var H = '00',
                M = '00',
                S = '00';
            H = $.formatTimeDouble(parseInt(secs/3600));
            secs %= 3600;
            M = $.formatTimeDouble(parseInt(secs/60));
            secs %= 60;
            S = $.formatTimeDouble(parseInt(secs));
            return {
                H : H,
                M : M,
                S : S
            }
        },
        formatTimeDouble: function(time) {
            return 10 <= time ? time : 
                    time > 0 ? '0' + time : '00';
        }
    });
})($);

 

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		
		<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
		<script type="text/javascript" src="js/jquery.time.js"></script>
		<script type="text/javascript">
		  $(function() {
		    $("#time").countDown(10);
		  });        
		</script>
	</head>
	<body>
		<div id="time"></div>
	</body>
</html>

 

posted @ 2015-12-01 14:44  居无常  阅读(217)  评论(0编辑  收藏  举报