Welcome toVigges Developer Community-Open, Learning,Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
3.1k views
in Technique[技术] by (71.8m points)

倒计时多次调用出现多个倒计时

我封装的代码:

function CountDown() {
    var maxtime = 120;
    var timer = setInterval(function () {
        maxtime--;
        var minutes = Math.floor(maxtime / 60);
        var seconds = Math.floor(maxtime % 60);
        if (minutes >= 0) {
            var msg = "倒计时: " + '0' + minutes + "分" + seconds + "秒";
            $('.del-time').html(msg);
        } else {
            clearInterval(timer);
        }
    },1000);
    
}

第一次触发都很正常,再次触发就会有两个时间在交替显示。我估计是maxtime没有释放掉,但我不能刷新页面,所以maxtime一直被定时器调用,调用一次CountDown,就会创建一个maxtime,该怎么办啊。


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Answer

0 votes
by (71.8m points)
var CountDownHelper = {
    timer:null,
    do:function(){
        var that = this;
        that.timer&&clearInterval(that.timer);
        var maxtime = 120;
        that.timer= setInterval(function () {
            maxtime--;
            var minutes = Math.floor(maxtime / 60);
            var seconds = Math.floor(maxtime % 60);
            if (minutes >= 0) {
                var msg = "倒计时: " + '0' + minutes + "分" + seconds + "秒";
                $('.del-time').html(msg);
            } else {
                clearInterval(that.timer);
            }
        },1000);
    }
};

//调用这个方法,在每次do的时候清除掉上一次创建的定时器
CountDownHelper.do();

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome to Vigges Developer Community for programmer and developer-Open, Learning and Share
...