I am having some trouble with jquery's live and die methods.
//bind above function to clicking a
$('a').live('click', functionThatWaitsFiveSeconds)
I need to attach an event handler to clicking a link - and I want to unbind the handler while the function is running to prevent the function running over and over before it is complete (function is performing a ajax request then handling the response.
I can do all of the above just fine.
However, because the above handler is attached to a (a) tag I need to return false (to prevent the link from being followed). To do this I need to bind a different function to handle clicks and return false.
I need to know how to unbind my complicated function - while keeping my simple (return false) bound at all times.
The above fiddle should work, but after unbinding the event handler, it doesn't bind again? I've tried a few combinations of namespacing etc but cannot get this together.
Update got it working
function denyRest() {
$("body").append("<h1>return false</h1>");
return false;
}
function functionThatWaitsFiveSeconds() {
$('a').die('click.thing', functionThatWaitsFiveSeconds);
var loader = $('<div class="loader">doing some stuff</div>');
$('#content').append(loader);
loader.animate({
'width': '500'
}, 5000, function() {
loader.remove();
$('a').die('click.otherthing', denyRest).live('click.thing', functionThatWaitsFiveSeconds).live('click.otherthing', denyRest);
});
}
$('a').live('click.thing', functionThatWaitsFiveSeconds);
$('a').live('click.otherthing', denyRest);
Updated fiddle.
I believe The issue was this.