Using the <a> tag as a button without a link to it

Question

I use the <a> tag to create buttons. I use JavaScript (jQuery) to implement the behavior.

How can I prevent the browser from following the link while continuing to execute all click() events?

It:

 $("a.button").live("click", function(event) { return false; }); 

does not work, because depending on the position of this handler, it may prevent other .click() handlers from being .click() . For some buttons, it works the way I want, but for some, it prevents my other handlers from executing.

I know that I could use one click handler for each button, but I would rather do it in an AOP-way.

Answer 1

jQuery provides a method called preventDefault that will stop the default event action for the event. In this case, the following code will cease to follow this link, but should not stop the distribution of even other handlers.

 $("a.button").click(function(event){ event.preventDefault(); });