Objectives and outcomes

In this tutorial we are going to learn how to open a link in button tag to open in new tab. When we have defined a link using anchor tag we have to just use target="_blank" inside the tag to open the link in new tab while with the button tag we use onClick="location.href=''" function to open a link but we cannot use target="_blank" inside button tag therefore the link does not open in the new tab using location.href. Well there are two solutions to this problem. Example for the same is given below:



HTML code:

<html>
<body>
<div class="col-md-6">
<button class="btn"><a target="_blank" href="index.php">button1</a></button>
</div>
<div class="col-md-6">
<button class="btn" onClick="window.open("index.php")">button2</button>
</div>
</body>
</html>

To open the link in new tab we can either use anchor tag between button tag or we can use window.open function in javascript to do the same task.