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

$("a.button").bind('click', function() { $(this).attr("disabled", "disabled"); });
$("a[disabled]").live('click', function() { return false; });

Does it. First line binds to all a-element with class button a function which sets (btw invalid for a-elements) disabled attribute to disabled.

Second function uses jQuery live event rebinding to bind "disabling" function to all future instances of a-elements which have and attribute disabled

Check jQuery Event documentation for more in-depth info on the two used functions if you want

Answer 2

I have an elegant solution for this if you're using links:

function do_nothing() { 
  return false;
}

// prevent a second click for 10 seconds. :)
$('.prevent_doubleclick').live('click', function(e) { 
  $(e.target).click(do_nothing); 
  setTimeout(function(){
    $(e.target).unbind('click', do_nothing);
  }, 10000); 
});

https://github.com/ssoroka/prevent_doubleclick.js

I'll add support for forms soon.

Answer 3

You always make a big hassle over a sipmple thing.

Set delayer self resetting variable when first click. That disables second clicks over some time. Simple!

    var formvar=1;

$('#myForm').submit(function() { 
    if(formvar==1) 
        {
        $(this).ajaxSubmit(options); // or do what ever normally do

        setTimeout(function(){formi=1}, 3000);
        formvar=0;
        }
    else alert("no dbl clicking");


    }); 

Answer 4

create a JS - include it on every page (or in your masterpage if you've got one.)

I think something like

$(document).ready(function(){
  $('.button').click(function(){
    $('.button').click(function(e) {
      e.preventDefault();
    });
  });
});