How to disable the onclick event once it happens?

Question

I had a image which calls add_cart() JavaScript function when onclick()

<img src="images/add.png" onclick="add_cart()">

I want the user to click the image only one time. When the user clicks it first time, add_cart function should be called. If he clicks second time no event should happen.

Answer 1

If you are dealing this on jquery side,you can use jquery one method

$(".myDiv").one("click", function(){  
    alert("this will happen only once");  
});

Cheers

Answer 2

window.onload = function() {
    document.getElementById('myImageId').onclick = handleImageClick;
}

var handleImageClick = function(e) {
    var target;
    if (!e) var e = window.event;
    if (e.target) targ = e.target;
    else if (e.srcElement) targ = e.srcElement;
    if (targ.nodeType == 3) // defeat Safari bug
        targ = targ.parentNode;

    if(target) {
        target.onclick = function(){}

        // do your stuff here
    }
}

Answer 3

Using

<img src="images/add.png" onclick="this.onclick = function(){};add_cart();">

Answer 4

<img src="images/add.png" onclick="add_cart(); this.onclick=null;">