怎样实现倒计时

<body>
<span id='ss'></span>
<script>
var timediff
function Countdown(time){
var arg = time.split('-');
for(var i=0;i<6;i++)
{if(!arg[i])arg.push(0)}
timediff = Date.parse((new Date(arg[0],arg[1],arg[2],arg[3],arg[4],arg[5])).toString()) - Date.parse((new Date()).toString());
    timediff   = timediff/1000;
    var day    = count(timediff,60*60*24);
var hour   = count(timediff,60*60);
    var minu   = count(timediff,60);
var second = timediff
    document.getElementById('ss').innerHTML=day+'天'+hour+'时'+minu+'分'+second+'秒';
}
function count(num,units){
timediff = timediff -parseInt(num/units)*units
return parseInt(num/units);
}
setInterval(function(){Countdown('2009-3-24-13-13-13');},1000) //这里输入时间格式'2009-3-24-13-13-13'
</script>
</body>

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="daojishi.aspx.cs" Inherits="suolve.daojishi" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>js倒计时</title>
    <script src="js/jquery.js" type="text/javascript"></script>
    <script src="js/jquery.countdown.js" type="text/javascript"></script>
    <style type="text/css">
        li{ list-style-type:none;}
    </style>
</head>
<body>
    <script type="text/javascript">
            $(function(){
                $('ul').countdown(function(s, d){
                    var items = $(this).find('span');
                    items.eq(0).text(d.total);
                    items.eq(1).text(d.second);
                    items.eq(2).text(d.minute);
                    items.eq(3).text(d.hour);
                    items.eq(4).text(d.day);
                });
            });
    </script>
    <ul data-seconds="3344">
        <li>总共<span>-</span>秒</li>
        <li><span>-</span>秒</li>
        <li><span>-</span>分</li>
        <li><span>-</span>时</li>
        <li><span>-</span>天</li>
    </ul>
    <ul data-seconds="97545">
        <li>总共<span>-</span>秒</li>
        <li><span>-</span>秒</li>
        <li><span>-</span>分</li>
        <li><span>-</span>时</li>
        <li><span>-</span>天</li>
    </ul>
    <ul data-seconds="10">
        <li>总共<span>-</span>秒</li>
        <li><span>-</span>秒</li>
        <li><span>-</span>分</li>
    </ul>
</body>
</html>

jquery.countdown.js
(function($){    var countdown = function(item, config)
    {
        var seconds = parseInt($(item).attr(config.attribute));
        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', 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(item, item, config);
        });
    };

    $.fn.countdown = main;})(jQuery);

调试易

怎样实现倒计时

解决方案 »