Code Snippet
Click Once and Unbind
Have something happen on a click event, but only once! Unbind the click handler after the element has been clicked once.
$('#my-selector').bind('click', function() {
$(this).unbind('click');
alert('Clicked and unbound!');
});Also see Ben's comment below for jQuery's .one() function which is essentially the same thing.
Doesn’t this have the same effect as:
$(‘#my-selector’).one(‘click’, function() {
alert(‘This can only happen once’);
});
?
Indeed it is, thanks for posting.
The bind formula does allow you to re-bind the click event later if needed.
I need to re-bind a click event after some animate effects have been applied. What I want to happen is allow the user to click the button only once until the animate sequence has completed. In other words click (only allow once until event finishes), unbind, animate, re-bind click. I have had some trouble with this, any suggestions?
Instead of binding and unbinding the event, maybe instead just check if the element is animated before doing what you were going to do.
You can test if something is currently being animated with :animated as part of the selector.
Sweet! thanks guys.
did not know the one() trick : -)
art
Hey,
one() is a nice feature, but not always is a working solution. When we have a function, and inside we bind click event, to call that function recursively, we need to unbind the callback before we can call the function – if not, we get infinite loop.
function f()
{
$('foo').click(function(){
$(this).unbind('click');
f();
});
// something else
}
We cannot do that with one() function. But thanks for the tips!
DigWP
A book and blog co-authored by Jeff Starr and myself about the World's most popular publishing platform.
Quotes on Design
Design, like Art, can be an elusive word to define and an awfully fun thing to have opinions about.
HTML-Ipsum
One-click copy to clipboard access to Lorem Ipsum text that comes wrapped in a variety of HTML.
Bookshelf
Hey Chris, what books do you recommend? These, young fertile mind, these.