How can I remove the event handler once the click event has fired?

Question

I have a click event I wired up on a div on my page.

Once the click event has fired, I want to unbind the event on that div.

How can I do this? Can I unbind it in the click event handler itself?

Answer 1

Taken from the jQuery documentation found here:

 $("#unbind").click(function () {
      $("#theone").unbind('click', aClick)
                  .text("Does nothing...");
    });

Answer 2

Use the "one" function:

$("#only_once").one("click", function() {
alert('this only happens once');
});

Answer 3

There's the unbind function documented here:

http://docs.jquery.com/Events/unbind

Fits your example :)

Answer 4

In plain JavaScript:

var myDiv = document.getElementById("myDiv");

myDiv.addEventListener('click', clicked, false);

function clicked()
{
    // Process event here...

    myDiv.removeEventListener('click', clicked, false);
}

Steve