How to disable click on div with turned off (), end animation and enable click with on () with jQuery?

Question

First of all, I understand that there are many similar questions like this, but I just can't figure out the answer or the jsfiddle answer doesn't work!

My question is quick and simple, I have a div that clicks the second div to the right. But I want the div to be invisible during the animation. Here is my code:

$("#go").click(function() { $("#go").off() functionlist["flip"]() $("#go").on() })​ 

But a div never becomes clickable. Am I really misunderstanding the language? Thank you very much!

http://jsfiddle.net/g5mJd/12/

EDIT: I would like to avoid the element being close during the animation, as I want to perform other functions, as well as clicking on run and still turn it off during the process. I used the animation as an example only.

Answer 1

That was interesting. What threw me away was something you could not appreciate: animated because you are using a method transition. I added the following to your click handler and also provided a fork here:

 var functionlist = { flip: function() { $("#block").transition({ x: '+=100' }, 500, function(){$("#block").attr('data-animating', "false");}); }, flop: function() { $("#block").transition({ rotateY: '0deg' }, 500) } }; $("#go").click(function() { if ($("#block").attr('data-animating') !== "true") { console.log($("#block").attr('data-animating')); $("#block").attr('data-animating', "true"); functionlist["flip"](); } });​ 

Answer 2

I think you do not understand slightly what on() and off() . on() does not restore the click handler, which is deleted off() , it attaches a new one. You must provide it with a handler to attach.

Instead of using on() and off() use the solution from this question: Make the element invisible during animation

Answer 3

This is the wrong use of jquery enable / disable methods. Please review the documentation again.

It is supposed to pass the event name and handler function to the on method.

$("#id").on("click", function() {});

and

$ ("# ID") by ("click").