jquery 倒计时插件

 <script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
<script>
        (function ($) {
            var countdown = function (item, config) {
                var st = new Date(parseInt($(item).attr(config.st)) * 100);
                var et = new Date(parseInt($(item).attr(config.et)) * 100);
                //alert(st.toLocaleString());
                //alert(et.toLocaleString());
                //var seconds = parseInt($(item).attr(config.attribute));
                var seconds = ((et - st) / 1000).toString();
                var timer = null;

                var doWork = function () {
                    if (seconds >= 0) {
                        if (typeof (config.callback) == "function") {
                            var data = {
                                total: seconds,
                                second: Math.floor(seconds % 60),
                                minute: Math.floor((seconds / 60) % 60),
                                hour: Math.floor((seconds / 3600) % 24),
                                day: Math.floor(seconds / 86400)
                            };
                            config.callback.call(item, seconds, data, item);
                        }
                        seconds--;
                    } else {
                        window.clearInterval(timer);
                    }
                }
                timer = window.setInterval(doWork, 1000);
                doWork();
            };
            var main = function () {
                var args = arguments;
                var config = { attribute: 'data-seconds', st: 'st', et: 'et', callback: null };
                if (args.length == 1) {
                    if (typeof (args[0]) == "function") config.callback = args[0];
                    if (typeof (args[0]) == "object") $.extend(config, args[0]);
                } else {
                    config.attribute = args[0];
                    config.callback = args[1];
                }
                $(this).each(function (index, item) {
                    countdown.call(function () { }, item, config);
                });
            };
            $.fn.countdown = main;
        })(jQuery);


    </script>
    <script type="text/javascript">
        $(function () {
            //alert(new Date('2011-10-15').getDay());
            //countdown({ attribute: 'data', callback: function () { }, });
            $('ul').countdown(function (s, d) {
                var items = $(this).find('span');
                items.eq(3).text(d.second);
                items.eq(2).text(d.minute);
                items.eq(1).text(d.hour);
                items.eq(0).text(d.day);
            });
        });
    </script>

<ul data-seconds="10" st="13187455380" et="13187455700">
        <li><span>-</span>天</li>
        <li><span>-</span>时</li>
        <li><span>-</span>分</li>
        <li><span>-</span>秒</li>
    </ul>
    <ul data-seconds="20" st="13187455380" et="13187455790">
        <li><span>-</span>天</li>
        <li><span>-</span>时</li>
        <li><span>-</span>分</li>
        <li><span>-</span>秒</li>
    </ul>
    <ul data-seconds="30" st="13187455380" et="13187455910">
        <li><span>-</span>天</li>
        <li><span>-</span>时</li>
        <li><span>-</span>分</li>
        <li><span>-</span>秒</li>
    </ul>
===========================================================================


var timer;
function TimeDown(id, endDateStr, interval) {
var endDate = new Date(endDateStr);
var nowDate = new Date();
if (endDate <= nowDate) { clearTimeout(timer); return; }
var totalSeconds = parseInt((endDate - nowDate) / 1000);
var days = Math.floor(totalSeconds / (60 * 60 * 24));
var modulo = totalSeconds % (60 * 60 * 24);
var hours = Math.floor(modulo / (60 * 60));
modulo = modulo % (60 * 60);
var minutes = Math.floor(modulo / 60);
var seconds = modulo % 60;

//sb.Append("<span class=\"s1\">0</span> <span class=\"s1\">6</span> <span class=\"s2\">天</span> <span class=\"s1\">2</span> <span class=\"s1\">3</span> <span class=\"s2\">小时</span> <span class=\"s1\">5</span> <span class=\"s1\">9</span> <span class=\"s2\">分</span>");

document.getElementById(id).innerHTML = "还剩:" + days + "天" + hours + "小时" + minutes + "分钟" + seconds + "秒"; //延迟一秒执行自己
var timer = setTimeout(function () { TimeDown(id, endDateStr); }, interval)
}
TimeDown("timer", '2014-11-11', 1000);

posted @ 2011-10-14 17:50  s80895304  阅读(225)  评论(0编辑  收藏  举报