javascript计时器

  javascript计时器,效果如下

javascript计时器

<script>
    function Timer(maxtime, id, callback) {
        //maxtime:时间,单位s
        //id:显示计时器信息的容器id
        //callback:计时器结束回调
        var tmp
        function CountDown() {
            if (maxtime >= 0) {
                day = Math.floor(maxtime / (60 * 60 * 24));
                tmp = maxtime - day * 60 * 60 * 24;
                hours = Math.floor(tmp / (60 * 60));
                tmp = tmp - hours * 60 * 60;
                minutes = Math.floor(tmp / (60));
                tmp = tmp - minutes * 60;
                seconds = tmp
                msg = "距离结束还有" + day + "天" + hours + "小时" + minutes + "分" + seconds + "秒"
                document.getElementById(id).innerHTML = msg;
                maxtime -= 1;
            }
            else {
                clearInterval(timer);
                if (typeof callback == "function") callback(); //执行倒计时完成后的回调
            }
        }
        var timer = setInterval(function () { CountDown() }, 1000);
    }
    window.onload = function () {
        new Timer(3*24*60*60, 'timer1', function () { document.getElementById("timer1").innerHTML = "计时器1完成"; });
        new Timer(40, 'timer2', function () { document.getElementById("timer2").innerHTML = "计时器2完成"; });
        new Timer(50, 'timer3', function () { document.getElementById("timer3").innerHTML = "计时器3完成"; });
    }
</script>
<div id="timer1" style="color:red; font-size:28px"></div> 
<div id="timer2" style="color:red; font-size:28px"></div> 
<div id="timer3" style="color:red; font-size:28px"></div> 

 

加支付宝好友偷能量挖...


原创文章,转载请注明出处:javascript计时器

评论(0)Web开发网
阅读(508)喜欢(1)JavaScript/Ajax开发技巧