How can I open a link in new tab (and not new window)?

JavascriptHtml

Javascript Problem Overview


I have an 'Open' button that 'calculates' a link that should be opened in a new tab. I try to use:

window.open(url, '_blank');

But that opens a new window.

I also tried the following method:

<form id="oform" name="oform" action="" method="post" target="_blank">
</form>

...

document.getElementById("oform").action = url;
document.getElementById("oform").submit();

Still, a new window is opened, instead of a new tab.

When using simple <a href...> with target='blank', the link is opened in a new tab.

Is there a solution?

Javascript Solutions


Solution 1 - Javascript

Update [2019] Most browsers today open in a new tab when you set the target to _blank. The days of popup windows is long gone. We can now use:

 <a href="some url" target="_blank">content of the anchor</a>

Most sane browsers will open the new window in a new tab.


CSS3 supports "open in new tab", by the property target-new

target-new: window | tab | none;

Update [2016]: this method never made it into the CSS3 spec, as one of the comments indicates. This shouldn't be used. However, it can be seen that most modern browsers open target='_blank' links in a new tab anyway, unless one attempts to resize the new tab immediately thereafter. However, there does not appear to be a mechanism to force this behavior in the specifications.


[2011] For a method of forcing opening in a new tab that is well supported, try the following:

<a href="some url" target="_newtab">content of the anchor</a>

Else, use this method to resize window immediately, to ensure that popup blockers do not kill your popup

Solution 2 - Javascript

Other than the CSS3 target-new option @anirudh4444 mentioned, you can't and mostly importantly probably shouldn't. You are trying to control the user's experience, when this should most likely be left up to the user.

Solution 3 - Javascript

You can use any of the following, I tested them all in 6 different browsers. (Google Chrome, Mozilla Firefox, Microsoft Internet Explorer, Opera, K-meleon* and Seamonkey.)

  1. <a href="blaah" target="_blank">Blaah</a>
  2. <a href="blaah" target="_tab">Blaah</a>
  3. <a href="blaah" target="_new">Blaah</a>

They all work the exact same, and the choice is completely up to preference.

*K-meleon, for some reason just opened up the page I was on when I clicked the link.

Solution 4 - Javascript

I was able to solve this issue using a "form" element.

function openNewTab(link) {
     var frm = $('<form   method="get" action="' + link + '" target="_blank"></form>')
     $("body").append(frm);
     frm.submit().remove();
}

For complete implementation and details visit my post http://mukesh.in/force-open-new-tab-in-browsers-instead-of-windows/

Or see this JSFiddle

Solution 5 - Javascript

Your form has target="_blank" (including a leading underscore) while your simple link has the target='blank' without the leading underscore. The "_blank" is a reserved word specifying a particular action, but "blank" is the name of a specific, possibly new, window. That's why you're getting different results. Both are pop-ups, but different types.

Each user has ultimate control about whether a pop-up should open a new window or a new tab. There's nothing you can do about it.

Solution 6 - Javascript

The following works in Chrome:

<script>
    function buildAndGo() {
        var aEl = document.getElementById('missingLink');
        aEl.href = "#" + resultOfSomeCalculation();

        var e = document.createEvent('MouseEvents');
        e.initEvent( 'click', true, true );

        aEl.dispatchEvent(e);
    }
</script>
...
<button onclick="buildAndGo()">Do it</button>
<a href="#" id="missingLink" target="_blank" style="visibility: hidden;"></a>

Working from the following sources to try and get an IE version working: Selenium BrowserBot, YUI User Action

Solution 7 - Javascript

In case of a link yes only using target tag would work.

But In case of a button try doing this with the onclick function instead of using just _blank

Use the window.open(url, target) function instead - it takes a URL, and a target window name, which behaves the same as the target="something" attribute on a link....like this

button(type="button", onclick="window.open('auth/google', '_blank');")

This should work.

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionErik SapirView Question on Stackoverflow
Solution 1 - JavascriptAnirudh RamanathanView Answer on Stackoverflow
Solution 2 - JavascriptKonView Answer on Stackoverflow
Solution 3 - JavascriptBenView Answer on Stackoverflow
Solution 4 - JavascriptMukesh AgarwalView Answer on Stackoverflow
Solution 5 - JavascriptJames AlarieView Answer on Stackoverflow
Solution 6 - Javascriptpsema4View Answer on Stackoverflow
Solution 7 - JavascriptNikhil NanjappaView Answer on Stackoverflow