javascript - JQuery - 重置计数时再次绑定（）

Question

在我的游戏中，我想确保开始按钮每次出现时只单击一次以停止它多次加载该功能。

如果计数大于零，我编写了一些代码来计算点击和取消绑定。

var oneClick = 0;
$(".start-btn-wrapper").bind("click", function () {
    oneClick++;
        if (oneClick > 0) {
        $(this).unbind("click");
    }
        newGame();
});

这很好用，但我需要一种方法来重新绑定它，以便下次它出现时（当点击restart-btn 时），所以我写了这个来重置计数。

$(".restart-btn").click(function () {
    resetGame();
    oneClick = 0;

});

出于某种原因，这不起作用，我正在寻找 SO 的解决方案

Answer 1

您没有再次绑定，只是更改了 oneClick，它甚至没有作为事件处理程序进行测试，$(".start-btn-wrapper")不再绑定。

但是，与其取消绑定/重新绑定成本高昂，不如直接测试oneClick：

$(".start-btn-wrapper").bind("click", function () {
    if (oneClick++ > 0) return;
    newGame();
}

请注意，如果您只需要两个状态，则布尔值会更清晰：

var clickable = true;
$(".start-btn-wrapper").bind("click", function () {
    if (!clickable) return;
    newGame();
    clickable = false;
}
$(".restart-btn").click(function () {
    resetGame();
    clickable = true;
});

Answer 2

jQuery 有一个内建的方法来实现这个用途。这是.one()

所以你所要做的就是

$(".start-btn-wrapper").one('click',newGame);

并重新启动

$(".restart-btn").click(function () {
    resetGame();
    $(".start-btn-wrapper").one('click',newGame);
});

Answer 3

简单的

var oneClick = 0;
$(".start-btn-wrapper").bind("click", function () {

        if (oneClick > 0) {
        return false;
    }
        oneClick++;
        newGame();
});

$(".restart-btn").click(function () {
    resetGame();
    oneClick = 0;

});

Answer 4

var oneClick = 0;

function clickHandler() {
    oneClick++;
        if (oneClick > 0) {
        $(".start-btn-wrapper").unbind("click");
    }
        newGame();
}

$(".start-btn-wrapper").bind("click", clickHandler);

$(".restart-btn").click(function () {
    resetGame();
    oneClick = 0;

    $(".start-btn-wrapper").bind("click", clickHandler);
});