Javascript - Open a given URL in a new tab by clicking a button

Javascript

Javascript Problem Overview


I would like to have a button that redirects to a given URL and opens in a new tab. How can this be done?

Javascript Solutions


Solution 1 - Javascript

Use this:

<input type="button" value="button name" onclick="window.open('http://www.website.com/page')" />

Worked for me and it will open an actual new 'popup' window rather than a new full browser or tab. You can also add variables to it to stop it from showing specific browser traits as follows:

onclick="window.open(this.href,'popUpWindow','height=400,width=600,left=10,top=10,,scrollbars=yes,menubar=no'); return false;"

Solution 2 - Javascript

In javascript you can do:

window.open(url, "_blank");

Solution 3 - Javascript

Adding target="_blank" should do it:

<a id="myLink" href="www.google.com" target="_blank">google</a>

Solution 4 - Javascript

You can forget about using JavaScript because the browser controls whether or not it opens in a new tab. Your best option is to do something like the following instead:

<form action="http://www.yoursite.com/dosomething" method="get" target="_blank">
    <input name="dynamicParam1" type="text"/>
    <input name="dynamicParam2" type="text" />
    <input type="submit" value="submit" />
</form>

This will always open in a new tab regardless of which browser a client uses due to the target="_blank" attribute.

If all you need is to redirect with no dynamic parameters you can use a link with the target="_blank" attribute as Tim Büthe suggests.

Solution 5 - Javascript

My preferred method has the advantage of no JavaScript embedded in your markup:

CSS

a {
  color: inherit;
  text-decoration: none;
}

HTML

<a href="http://example.com" target="_blank"><input type="button" value="Link-button"></a>

Solution 6 - Javascript

Use window.open instead of window.location to open a new window or tab (depending on browser settings).

Your fiddle does not work because there is no button element to select. Try input[type=button] or give the button an id and use #buttonId.

Solution 7 - Javascript

> Open in new tab using javascript

 <button onclick="window.open('https://www.our-url.com')" id="myButton" 
 class="btn request-callback" >Explore More  </button>

Solution 8 - Javascript

I just used target="_blank" under form tag and it worked fine with FF and Chrome where it opens in a new tag but with IE it opens in a new window.

Solution 9 - Javascript

try this

<a id="link" href="www.gmail.com" target="_blank" >gmail</a>

Solution 10 - Javascript

Try this HTML:

<input type="button" value="Button_name" onclick="window.open('LINKADDRESS')"/>

Solution 11 - Javascript

You can't. This behaviour is only available for plugins and can only be configured by the user.

Solution 12 - Javascript

<BUTTON NAME='my_button' VALUE=sequence_no TYPE='SUBMIT' style="background-color:transparent ; border:none; color:blue;" onclick="this.form.target='_blank';return true;"><u>open new page</u></BUTTON>

This button will look like a URL and can be opened in a new tab.

Solution 13 - Javascript

USE this code

function openBackWindow(url,popName){
        var popupWindow = window.open(url,popName,'scrollbars=1,height=650,width=1050');
          if($.browser.msie){
            popupWindow.blur();
            window.focus();
        }else{
           blurPopunder();
        }
      };
    
    function blurPopunder() {
            var winBlankPopup = window.open("about:blank");
            if (winBlankPopup) {
                winBlankPopup.focus();
                winBlankPopup.close()
            }
    };

IT works fine in Mozilla,IE and chrome on and less than 22 version; but doesn't work in Opera and Safari.

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
Questionwong2View Question on Stackoverflow
Solution 1 - JavascriptLuke AldertonView Answer on Stackoverflow
Solution 2 - JavascriptsatnamView Answer on Stackoverflow
Solution 3 - JavascriptTim BütheView Answer on Stackoverflow
Solution 4 - JavascriptTonyView Answer on Stackoverflow
Solution 5 - JavascriptSpyderScriptView Answer on Stackoverflow
Solution 6 - JavascriptJames AllardiceView Answer on Stackoverflow
Solution 7 - JavascriptSiddharth ShuklaView Answer on Stackoverflow
Solution 8 - JavascriptObaidul HyeView Answer on Stackoverflow
Solution 9 - JavascriptLove KumarView Answer on Stackoverflow
Solution 10 - Javascriptraj moriView Answer on Stackoverflow
Solution 11 - JavascriptckruseView Answer on Stackoverflow
Solution 12 - JavascriptJoleneView Answer on Stackoverflow
Solution 13 - JavascriptLalit GuglaniView Answer on Stackoverflow