How can I prevent button-mashing when using anchors instead of buttons?
<p>I'm using buttons to submit data via Ajax. I'm using jQuery to disable and enable the buttons. This is to prevent "button-mashing," where a user can fire multiple requests either maliciously or unwittingly. </p>

<p>Is there an "element-agnostic" way to prevent this behavior in jQuery? For example, say I wanted to use anchors instead of buttons to submit the data. A button I can disable; but as far as I know you can not disable anchors.</p>

<p>Here is how I'm doing this now: (note I've removed some of the unnecessary code to make it shorter)</p>

<pre><code> $('.fav .button').click(function() {
  $.ajax({
   context: this,
   dataType: 'json',
   beforeSend: function() {
    // Toggle state; disable button to prevent button mashing
    $(".fav").toggleClass("fav-state-1");
    $(".fav .button").attr("disabled", true);
   },
   error: function() {
    // Rollback state and re-enable button on error
    $(".fav").toggleClass("fav-state-1");
    $(".fav .button").attr("disabled", false);
    },
   success: function(response) { 
    if (response.result == "success") { 
     $(".fav .button").attr("disabled", false);
    } 
    else {
     // Rollback state; re-enable button
     $(".fav").toggleClass("fav-state-1");
     $(".fav .button").attr("disabled", false);
    }
   }
  });
  return false;
 });
</code></pre>

<p>HTML:</p>

<pre><code>&lt;input class="button" type="button" value=""&gt;
</code></pre>
