How to make a button link open in a new tab only using HTML?

Question

I have this piece of code:

<button name='link' onclick="window.location.href = 'Text.html';"  
style="cursor:pointer"  class='Text' value='Text.html' title='Text'>Text</button>

On click it will take you to one of my sub-sites. I wanted it to open the link in a new tab so I tried putting target='_blank' in the button tag, but it didn`t work. If possible I would prefer to use HTML.

Thanks

Phishy · Answer 1 · 2020-01-10T22:09:26.440

0

Edit: While the original answer works, it isn't in line with the W3C HTML5 specs. An alternative would be to edit the JavaScript in the onclick attribute to open the link in a new tab.

<button
  onclick="window.open('Text.html', '_blank')"
  name="link"
  style="cursor: pointer"
  class="Text"
  value="Text.html"
  title="Text"
>
  Text
</button>

You could wrap an <a> tag around the button instead.

<a href="Text.html" target="_blank">
  <button
    name="link"
    style="cursor: pointer"
    class="Text"
    value="Text.html"
    title="Text"
  >
    Text
  </button>
</a>

edited Jan 10 '20 at 22:09

answered Jan 10 '20 at 05:47

Phishy

79
5

you really shouldn't put button tags in a tag – Banana.html Jan 10 '20 at 05:49
see https://stackoverflow.com/questions/6393827/can-i-nest-a-button-element-inside-an-a-using-html5 – Banana.html Jan 10 '20 at 05:50
True, would not be best practice. You can edit your `onclick` attribute to `window.open('Text.html', '_blank')` if you don't mind throwing in some JS. – Phishy Jan 10 '20 at 06:01

score 0 · Answer 2 · answered Jan 10 '20 at 06:38

0

What about using form

<form action="//example.com/Text.html" target="_blank">
    <button type="submit">Text</button>
</form>

This can take to different site or any of your sub-site.

answered Jan 10 '20 at 06:38

Hášíl Páůďýál

672
1
6
13

score 0 · Answer 3 · answered Jan 10 '20 at 07:52

0

Replace button tag with a

<a href="Text.html" title="Text" target="_blank">Text</a>

answered Jan 10 '20 at 07:52

Lekh Raj

80
1
4

How to make a button link open in a new tab only using HTML?

3 Answers3