disable click event handler for a duration of time

Question

I've already looked at similar questions but the answers provided involve buttons and not div elements. When I click the div element with id click, the click event handler is disabled by unbind() and sets a timer for 2 seconds. After 2 seconds, the click event handler should be enabled again by bind(). The problem is that the click event handler doesn't seem to get "rebound". I am appending text to another div element to check if the click event handler is active.

Here is my JSFiddle.

Solution

Another approach to the whole problem is not to bother with unbinding and rebinding and just use a "disabled" flag:

$(document).ready(function(){

   var clickDisabled = false;
   $('#click').click(function(){
      if (clickDisabled)
         return;

      // do your real click processing here

      clickDisabled = true;
      setTimeout(function(){clickDisabled = false;}, 2000);
  });

});