CODEWITHSUNDEEP
javascriptjquery
sMilbz
sMilbz

Reputation: 951

JQuery - bind() again when count is reset

In my game I want to make sure the start button is only clicked once each time it appears to stop it loading the function more than once.

I have written some code that counts the clicks and unbinds if the count is greater than zero.

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

This works fine but I need a way to bind it again ready for the next time it appears (When the restart-btn is clicked) so I have written this to reset the count.

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

});

For some reason this doesn't do the job and I am looking to SO for a soloution

Upvotes: 2

Views: 400

Answers (4)

Denys Séguret
Denys Séguret

Reputation: 382170

You're not binding again but just changing oneClick, which isn't even tested as the event handler to $(".start-btn-wrapper") isn't binded anymore.

But instead of unbinding/rebinding, which is costly, why not just test oneClick :

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

Note that if you just need two states, a boolean would be clearer :

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

Upvotes: 2

belykh
belykh

Reputation: 1290

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);
});

Upvotes: 0

Gabriele Petrioli
Gabriele Petrioli

Reputation: 196002

jQuery has a built in method for exactly this use. It is .one()

So all you have to do is

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

and for the restart

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

Upvotes: 1

Kanishka Panamaldeniya
Kanishka Panamaldeniya

Reputation: 17576

simple 

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

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

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

});

Upvotes: 0

Related Questions