Question

我遇到控制停止并基于超时返回游戏的问题。我的代码：

var state = true, timer;

function block(isOn) {
    if (isOn) {
        $('#block').click(function () {
            $(this).fadeOut(1200, function () {
                state = true;
                timer = setInterval(playGame, 500);
            });
        });
    } else {
        clearInterval(timer);
        $('#block').fadeIn(1200, function () {
            block(true);
        });
    }
}

function playGame() {
    if (state) {
        (repeated game instructions)
    } else {
        block(false);
    }
}

$(document).ready(function () {
    block(true);
    $('#refresh').click(function () {
        state = false;
    });
});

Block就像我的起始页和分页页面。游戏以true上的区块设置开始，点击游戏以区间开始。但点击#stop游戏停止状态更改我想重置计时器clearInterval。然后我再次展示block(true)。它有效，但当玩家再次点击#block返回游戏时，它会以双倍速度开始。看起来有两个playGame函数实例同时工作。我不知道它是什么，也许我不恰当地使用Interval。

修改谢谢Antony，但改成setInterval并没有解决我的问题。我将blockUp和blockDown更改为一个函数。我已将上面的代码更新为我的实际进度。

我尝试将clearInterval(timer);更改为timer = null;和delete window.timer;。然后我开始谷歌重新启动setInterval，我发现这是严重的问题。我的游戏使用了很多jquery对象，所以我不想创建计时器阵列，我正在寻找经济的解决方案：）

Answer 1

每次停止游戏时都必须从#block取消绑定点击事件，因为每次点击播放时都会注册一个新的点击处理程序。

$('#refresh').click(function () {
    state = false;
    $('#block').off('click'); // flushes every click bound to `#block`
});

以下是如何逐个取消绑定处理程序：

var handler1, handler2;
$('#block').click(handler1 = function () { alert(1); });
$('#block').click(handler2 = function () { alert(2); });
// one click shows "1" then "2"
$('#block').off('click', handler1);
// one click shows "2"

使用Interval停止并恢复（或重新启动）

1 个答案: