Question

I would like to temporary disabling a click event on a JQuery element, bound with jstree and Backbone.View.delegateEvents().

Below is how I process to do

before disabling the event, I record the event in a local variable using

self.defaultClick = $(this).data('events').click[0];

after, I disable the click event using

$(this).click(false);

Now I need to be bound again, I assign it back to the element using

$(this).data('events').click = self.defaultClick;

That works good, until the second time.

I get this error from JQuery.event.add ‘Object # has no method ‘push” at this line

handlers.push( handleObj );

The problem is ‘handlers’ becomes the event itself after the second assignment, while it s an array at the first assignment.

Any idea, how can I get around ?
either by avoiding reassign the event after being sure it s already bound, or may be using another way to assign the event ?

Thank you for your help.

EDIT

I am using jstree on this application.
I bound specific events on css class but, regarding the state of the application, I need to be able of disabling all the tree (including the class that are bound previously).

Answer 1

Binding/unbinding a handler is expensive; why not just use a delegated event handler, set to run for a particular class name (e.g. .executeState) — then you can control whether or not to run the code simply by toggling the class: $(element).toggleClass('executeState');

This way, only a single handler is bound, only once, to the document (or any parent element of the element you’re targeting).

$(document).on('click', '.executeState', function() {
    // handler for click event
});