jQuery: Unbind event handlers to bind them again later

Question

Does anybody know how to unbind set of event handlers, but memorize them in order to bind them again later? Any suggestions?

Answer 1

There is a jQuery plugin called Copy Events, which copies events from one object to another. This could very easily be used to "save" events from one element and bring them back later. Just one more option :)

Edit: fixed broken link

Answer 2

Since jQuery 1.4.2+ changes how event handlers are stored, this seems relevant:

The best way I found was to use event namespacing:

var ary_handlers = [ fn_highlight, fn_onpress, fn_cleanup ];
for ( idx = 0; idx < ary_handlers.length; idx++ ){
  $('#test').bind('click.foobar',ary_handlers[idx]);
}

// and then later: 
$('#test').unbind('.foobar');  

In the above example, all foobar events unbound. Notice that if you needed finer grain control, you could namespace each click handler and correlate to your array of handlers:

var ary_handlers = [ fn_highlight, fn_onpress, fn_cleanup ];
for ( idx = 0; idx < ary_handlers.length; idx++ ){
  $('#test').bind('click.ns_' + String(idx), ary_handlers[idx]);
}

// and then later you could pick off a specific one to unbind
$('#test').unbind('.ns_2');

Answer 3

Nick Craver appears to have the correct answer for jQuery 1.4.2+. He also includes a helpful fiddle. His solution allows you to retrieve all event handlers attached to a jQuery element and to figure out which handler they were attached to.

Answer 4

There is a events element in the data of the item. This should get your started, you can read your elements and store the handlers in an array before unbinding. Comment if you need more help. I got this idea from reading the $.fn.clone method so take a look at that as well.

$(document).ready(function() {
    $('#test').click(function(e) {
        alert('test');
        var events = $('#test').data("events");
        $('#test').unbind('click', events.click[0]);
    });
});

<a id="test">test</a>

Answer 5

You could use the event.handler parameter:

$(document).ready(function() {
    $('#test').click(function(e) {
        e.preventDefault();
        alert('test');
        $('#test').unbind('click', e.handler);
        //Do Something...
        $('#test').click();
    });
});

<a id="test">test</a>

event.handler returns the current handler that has received the event, So by omitting it you could keep the other handlers.

Answer 6

In order to unbind an event handler you need to pass the handler function into unbind(). So you already have the handler function, all you have to do is remember it.