Html Button Opening Link in New Tab
So This Is the Simple Code for the Button to Open a Certain Link Google but It Opens It on the Same Page, I Want the Link to Open on a New Tab Though. 0 11...
So this is the simple code for the button to open a certain link
<button class="btn btn-success" onclick="location.href='"> Google</button>
but it opens it on the same page, I want the link to open on a new tab though.
11 Answers
You can use the following.
window.open(
'
'_blank' // <- This is what makes it open in a new window.
);
in HTML
<button class="btn btn-success" onclick=" window.open(')"> Google</button>
With Bootstrap you can use an anchor like a button.
<a class="btn btn-success" href="" target="_blank">Google</a>
And use target="_blank" to open the link in a new tab.
You can also add this to your form:
<form action="" target="_blank">
Try using below code:
<button title="button title" class="action primary tocart" onclick=" window.open(' '_blank'); return false;">Google</button>
Here, the window.open with _blank as second argument of window.open function will open the link in new tab.
And by the use of return false we can remove/cancel the default behavior of the button like submit.
For more detail and live example, click here
To open a new tab with a button you just have to choose any of these options:
- Open link in a new tab hmtl:
<a href="" target="_blank">The Website Linked</a>
- Button open link in new tab:
<button class="btn btn-success" onclick=" window.open(')"> Google</button>
- Open new tab when clicking link html:
<!-- add target="_blank" to open new tab when link is clicked [in HTML]-->
<a href="YourLink" target="_blank">YourText</a>
Use '_blank'. It will not only open the link in a new tab but the state of the original webpage will also remain unaffected.
Try this
window.open(urlValue, "_system", "location=yes");
Try this code.
<input type="button" value="Open Window"
onclick="window.open(')">
If you're in pug:
html
head
title Pug
body
a(href="" target="_blank") Example
button(onclick="window.open(')") Example
And if you're puggin' Semantic UI:
html
head
title Pug
link(rel='stylesheet' href=')
body
.ui.center.aligned.container
a(href="" target="_blank") Example
.ui.center.aligned.container
.ui.large.grey.button(onclick="window.open(')") Example
This worked for me.
onClick={() => {window.open(');}}
In end of the form button can be added like this using target="_blank"
<a href= {{$example->hosted_example_url }} class="button" target="_blank">View</a>