How to prevent the middle-button from opening a new tab in the browser?

Question

I have a group of links on a page. when the user clicks a link it triggers an asynchronous request and a content area on the page is updated with the response html.

This works fine, except for if the user clicks the link with the 'middle-button' (or mouse wheel, whatever it's called!). Then a new tab opens and the response gets returned and rendered to that tab.

Is there any way for me to prevent this from happening?

Answer 1

Unfortunately no, Javascript wont have access to that sort of control for security reasons as it would be wide open for abuse.

Answer 2

catch the link with javascript and override the default link behaviour.

like this:

$('a.ajax').click(function(e){
   e.preventDefault();
   // do ajax stuff, and add an onfinish function that does
   // something like document.location.href = this.attr('href');
});

You don't have to do the document.location.href, as I just noticed that a content area is updated. Just catch the default behaviour with the e.preventDefault();

// edit The preventDefault won't stop the middle mouse button... Have you considered not using tags? I know it should be accessible so maybe a span containing the link, so you can add the onclick event on the span and hide the link with css?