Disabling links to stop double-clicks in JQuery

Question

How would I disable all links with the button class after they are clicked once? I\'d like to be able to do this in one place, and not have to change all of the

Answer 1

I'm using this to disable the "click" event send twice ( not the "double click" events ). Work for IE>=9, firefox, webkit, or chrome. The first click event disable the button/link/span, during a time. After time passed, button/link/span is enable and the user can click on it.

$(document).ready(function() {
/** 
 * disable double click 
 **/
document.addEventListener('click', function(event) { 

    var targetElement = event.target || event.srcElement;
    var target = $(targetElement);

    var eLink = target.prop("tagName") === 'A'; // hypertext link
    var eButton = target.prop("tagName") === 'BUTTON'; // button 
    var fButton = target.prop("tagName") === 'SPAN' && target.parent().parent().hasClass("fbutton"); // flexigrid buttons

    if ( eLink || eButton || fButton ) {

        if ( target.data("clicked") ) {
            event.stopPropagation();
            event.preventDefault();
            if ( window.console ) {
                console.log("double click event disabled");
            }
            return false;
        } else {

            target.data("clicked", true);
            target.prop('disabled', true);
            target.addClass("clicked");

            setTimeout(function() {
                target.data("clicked", false);  
                target.prop('disabled', false);
                target.removeClass("clicked");

            }, 500); // Do something after 500 millisecondes
            return true;
        }
    }

    }, true);


});