1

I'm trying to get a link that will both open in the current page, or when command/ctrl clicked (etc.) will open in a new tab/window based on the users settings. Right now I'm using something like this:

<a href='http://example.com' onclick="setTimeout(function() {window.location='/some_local_page'}, 10); return false;">Foo!</a>

This allows me to click on the link and have it open the local page, but I have to explicitly right click and choose open in new tab/window. I'm pretty sure this is a solved problem, but I can't find the right combination of google/stackoverflow keywords. :)

This might help for clarification:

<a href='http://example.com' onclick="some_javascript_function(); return false;">Foo!</a>

In this case a click should call some_javascript_function() and a command/ctrl click should open "http://example.com" in a new tab/window and do nothing to the current page.

Improve this question
8
  • 2
    Why are you trying to do anything at all? This is already default behaviour in pretty much every browser. If you just don't return false, and don't use the window.location business, and don't override the default behaviour of the click (which you aren't), this should work automatically. Commented Feb 29, 2012 at 19:25
  • What are you trying to do? Why are you using setTimeout to redirect me to a completely different page from the link I clicked on? I'm so confused. Which link do you want to open, and where do you want it to open? Your onclick has return false which stops the browser from following the link normally. Commented Feb 29, 2012 at 19:27
  • 1
    Messing default browser behaviour almost always sounds like bad idea. Commented Feb 29, 2012 at 19:28
  • the href to example.com is a different location than /some_local_page Commented Feb 29, 2012 at 19:43
  • 1
    Normal click changes the current page to /some_local_page. ctrl+click opens example.com in a new window (and does nothing to the current page). Commented Feb 29, 2012 at 20:09

2 Answers 2

Reset to default
7

Is this what you want?

<a href="http://example.com" onclick="window.open('/some_local_page')">Foo!</a>

Or this?

<a href="/some_local_page" target="_blank">Foo!</a>

EDIT: The onclick will fire when the center or left button is clicked (but not the right button).

So, in the onclick, you need to detect if ctrl was pressed, or if it was the middle button.

I also suggest not putting JavaScript inline. Try this:

<a href="http://example.com" class="link" data-link="/some_local_page">Foo!</a>​ $('a.link').click(function(e){ if(e.button === 0 && !e.ctrlKey){ // Click without ctrl e.preventDefault(); // open local page window.location = $(this).data('link'); } // Middle click and ctrl click will do nothing, // thus allowing the brower to open in a new window });​

DEMO: http://jsfiddle.net/E8hEt/

Improve this answer
Sign up to request clarification or add additional context in comments.

5 Comments

For the first one, that is definitely not the behavior I'm looking for. If you click on the link you get a new tab to /some_local_page and the current page goes to "example.com" If you command/ctrl click it opens both in new windows.
@Nik: What is the behavior you want?
See the post edit for a clarification. The gist is that onclick should make an action on the current page, but the href should be able to be opened in another tab if the user command/control/center clicks.
@Nik: Try the new code I added. I think it'll do what you want.
The only thing that needs to change is that we also need to check the metaKey. so it becomes: (e.button === 0 && !(e.ctrlKey || e.metaKey))
1

Why don't you render the same url in its href attribute if you want go to the same url?. And to open it in a new window set the target to _blank.

<a href='/some_local_page' target='_blank'>Foo!</a>
Improve this answer

1 Comment

I'm not trying to just open /some_local_page in a new window. I want to open /some_local_page in the current window and "example.com" in another tab/window if the user command/control clicks on the link.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.