2
var times = 0;
jQuery(window).load(function(){
   $(".banana").click(function(){
     console.log(times);
     times++;
     if(times == 3){
        $("#b1").unbind('click');
     }
    if(times == 6){
        $("#b1").bind('click');
    }
   });
});

And HTML code:
img id="b1" src=".../" class="banana"
img src=".../" alt="" class="banana"

I have preceding example as when I try to enable div event handler click.But It doesn't work.I read some topics like that I it does not solve the problem.Please,help me?

1
  • I don't have a solution, but the issue appears to be with the bind function since other functions operate as expected: jsfiddle.net/NotInUse/YQFwz/2 Commented Apr 21, 2013 at 17:34

3 Answers 3

1

You forgot the dot for the class (the selector should be $('.banana').

var times = 0;
jQuery(window).load(function(){
   $(".banana").click(function(){
     console.log(times);
     times++;
     if(times == 3){
        $("#b1").unbind('click');
     }
    if(times == 6){
        $("#b1").bind('click');
    }
   });
});
Sign up to request clarification or add additional context in comments.

4 Comments

thnk.But it doesn't work as I want to enable click .b1 when times reach to 6
Ah yes .. your other selector is also wrong :) should be # instead of ., since b1 is an id
yes.I correct the mistake but div is disabled when times reach to 3 but cannot enable when reach to 6
@haind I read somewhere that 'bind' and 'unbind' should be present only in 'on' or 'off' functions - preferred.
1

What you want is to prevent the dreaded stacking of click events. There are different ways of handling that, but in basic they all come down in setting a Boolean.

In your example I have set a data() tag to your #choices container starting with the value false. Upon click I change the Boolean value to true. Basically if processing=false I execute the code in the click callback.

    $("#choices").data('processing', false);

    $("#rock").click(function () {
        if (!$(this).parent().data('processing')) {
            $(this).parent().data('processing', true);
            user = roPaSc[0];
            gamePlay();
        }

    });
    $("#paper").click(function () {
        if (!$(this).parent().data('processing')) {
            $(this).parent().data('processing', true);
            user = roPaSc[1];
            gamePlay();
        }
    });
    $("#scissors").click(function () {
        if (!$(this).parent().data('processing')) {
            $(this).parent().data('processing', true);
            user = roPaSc[2];
            gamePlay();
        }
    });

After your animation, the boolean value needs to be reset . I do this in the openEyes function in the "else-statement".

   else {
            $("#you").attr({
                'src': user
            });
            $("#computer").attr({
                'src': com
            });
            $("#choices").data('processing', false);
        }

Here is the adjusted fiddle of "rock-paper-scissors": http://jsfiddle.net/gpxxn/2/

2 Comments

thnks Daniel for above example but they're not what Im looking for.Like name of topic, I just want to know how to disable and enable div when I click on.It seem quite difficult to explain.This's all I think with **rock,paper,scissors **game : jsfiddle.net/haind/gpxxn
But it have a trouble when I doubleClick or three clicks on rock,paper,scissors for choice.It run 2 or 3 times which do the same things.I want before show result, click div should be disable and enable when result is showed
0

This is not the answer to your problem, but a little advice on your code.

Use "document ready" instead of load.

$(window).load(function(){...

replace with

$(document).ready)function(){...

They will both work for you, but there is slight differences. "ready" will bind your events to your elements right after the page structure is loaded, but still before the content is loaded.

$(window).load() will wait for all the content to be loaded. That includes images.

4 Comments

I use $(window).load(function(){... because sometimes I want all images load before we click on images
The structure is loaeded, meaning that the image tag is there. Just the image is not yet loaded. You are able to bind events on document ready to the "img"-tag
I don't understand.If without any image ,so where do I click on to...fadeOUt an image for instance.How can we do?
So you want the image to fadeout after an amount of clicks? Then it will disappear from your document and "not be there anymore" as it will get display:none. It is not quite clear in the question above on what you try to achieve.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.