Question

我正在进行一个Javascript定时测验，有10个问题需要在60秒内回答。如果参赛者在50到60秒内尝试问题，它可以正常工作，但如果他在更短的时间内完成并重新开始测验，则计时器以两倍的速度运行。可能是较早的计时器没有被清除。这是脚本：

$(window).ready(function() {
    $('#fblock').hide();
    $('#sblock').show();
    $('#qblock').hide();
    $('.startquiz').click(function() {
        qsi = 0;
        score = 0;
        showq(0);
        $('#fblock').hide();
        $('#sblock').hide();
        $('#qblock').show();

        var secs = 0;
        var id = setInterval(function() {
            secs++;
            console.log(secs);
            document.getElementById("timer").innerHTML++;
            if (secs > 60) {
                clearInterval(id);
                $('#result').html(score);

                $('#qblock').hide();
                $('#fblock').show();
            }
        }, 1000);
    });
    $('.restartquiz').click(function() {
        $('#fblock').hide();
        $('#sblock').show();
        $('#qblock').hide();
        document.getElementById("timer").innerHTML = 0;
    });
});

Answer 1

对我来说，看起来区间被取消的唯一时间是，当＆＃34;计时器＆＃34; （secs）实际上输出的数量为60。加倍速度可以通过secs++解释（在重新启动测验后）执行两次（每个启动间隔一次）。

尝试取消按下.restartquiz - 按钮时执行的功能中的间隔。

这可能看起来像那样（未经测试）：

var interval = null;
$(window).ready(function() {
    $('#fblock').hide();
    $('#sblock').show();
    $('#qblock').hide();
    $('.startquiz').click(function() {
        qsi = 0;
        score = 0;
        showq(0);
        $('#fblock').hide();
        $('#sblock').hide();
        $('#qblock').show();
        var secs = 0;
        interval = setInterval(function() {
            secs++;
            console.log(secs);
            document.getElementById("timer").innerHTML++;
            if (secs > 60) {
                clearInterval(interval);
                $('#result').html(score);

                $('#qblock').hide();
                $('#fblock').show();
            }
        }, 1000);
    });
    $('.restartquiz').click(function() {
        $('#fblock').hide();
        $('#sblock').show();
        $('#qblock').hide();
        clearInterval(interval);
        document.getElementById("timer").innerHTML = 0;
    });
});

无法取消setInterval

1 个答案: