js倒计时代码 支持同一页面多个倒计时代码(转)

来源:互联网 发布:数据化人生 编辑:程序博客网 时间:2024/05/20 00:15

js倒计时代码:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><html> <head>  <title>js倒计时代码</title>  <meta name="Generator" content="EditPlus">  <meta name="Author" content="k686绿色软件 http://www.k686.com">  <meta name="Keywords" content="绿色软件">  <meta name="Description" content="绿色软件"> </head> <body> k686绿色软件 - http://www.k686.com<script>function countDown( maxtime,fn ){       var timer = setInterval(function()   {   if(maxtime>=0){    minutes = Math.floor(maxtime/60);    seconds = Math.floor(maxtime%60);    msg = "距离结束还有"+minutes+"分"+seconds+"秒";    fn( msg ); if(maxtime == 5*60) alert('注意,还有5分钟!');    --maxtime;   }    else{   clearInterval( timer );fn("时间到,结束!");  }   }, 1000);}</script><div id="timer1" style="color:red"></div><div id="timer2" style="color:red"></div> <script>countDown( 6,function( msg ){document.getElementById('timer1').innerHTML = msg;});countDown( 6000,function( msg ){document.getElementById('timer2').innerHTML = msg;}) </script> </body></html>

忠心感谢来自56484577Q群的wait提供的代码: http://waitdemos.googlecode.com/svn/trunk/tdemos/countDown.html

此代码的优点在于调用时可不用对功能代码做任何修改.需要显示的地方设定容器id,然后输出一小段代码,一个页面无限制倒计时个数:

countDown( 6,function( msg ){document.getElementById('timer1').innerHTML = msg;});

就可以了.

下面一段代码是来自同一个交流群的大神Vilic优化简写后的代码,在此一并表示感谢:

<!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>    <title>Timer - by Vilic JavaScriptQQ交流群56484577</title></head><body>    <div id="timer1"></div>    <div id="timer2"></div>    <div id="timer3"></div></body><script type="text/javascript">    var addTimer = function () {        var list = [],            interval;        return function (id, time) {            if (!interval)                interval = setInterval(go, 1000);            list.push({ ele: document.getElementById(id), time: time });        }        function go() {            for (var i = 0; i < list.length; i++) {                list[i].ele.innerHTML = getTimerString(list[i].time ? list[i].time -= 1 : 0);                if (!list[i].time)                    list.splice(i--, 1);            }        }        function getTimerString(time) {            var not0 = !!time,                d = Math.floor(time / 86400),                h = Math.floor((time %= 86400) / 3600),                m = Math.floor((time %= 3600) / 60),                s = time % 60;            if (not0)                return "还有" + d + "天" + h + "小时" + m + "分" + s + "秒";            else return "时间到";        }    } ();    addTimer("timer1", 12);    addTimer("timer2", 10);    addTimer("timer3", 13);</script></html>

转自:http://tuzwu.iteye.com/blog/819081
0 0
原创粉丝点击