Question

So I have a class of text inputs in a form. Attached to them is a .live click event as such:

$('.post-deal-inputs').live('click', function(e) {
$(this).val('');
$(this).unbind(e);
});

This is meant to clear the text on click but only once so that the newly entered user data is not removed. However, for some reason this does not work, it keeps clearing the text on subsequent clicks. I have also tried

.one('focus', function(e))......

but that doesn’t even fire.
Is there a way, without a switch statement to check the default text etc to make sure the text is only cleard once?

Answer 1

Event handlers attached with live are not removed with unbind; they’re removed with die

So try:

$('.post-deal-inputs').die();

Or, if you’ve attached other events, then

$('.post-deal-inputs').die("click");

Note that this will kill all of your events that match this selector. If you want it to only be removed from a particular item, then I would switch over to the bind unbind model. Just note that this will not work with dynamically added content

Note that if you’re using jQuery 1.7, the preferred way of dealing with events is with on (and off)

---

Because .live() is performing event delegation at the document level, if you use .die(), it will of course no longer work for any elements matching the selector.

If you want to stop the functionality for only one element matching the original selector, just change the class of that element so that it no longer matches.

$('.post-deal-inputs').live('click', function(e) {
    $(this).val('');
    $(this).removeClass('post-deal-inputs')
           .addClass('post-deal-inputs-clicked');
});