How to Open Webpage Links in a New Tab in jquery?

Today, We want to share with you jquery open link in new tab.In this post we will show you how to open a referenced resource of a link in a new tab in jQuery Example., hear for first of all Opening of a URL in a new tab or window depends on the browser and the user’s browser preferences. we will give you demo and example for implement.In this post, we will learn about jquery – Simple open url in new window jquery with an example.

How to open a URL in a new tab (and not a new window) using jQuery?

There are some times when you pay want to force links URL to open in a new window. It could be to open read and write permission, adverts or external links. IMP: that some believe that you should never force a href link to open in a new window or new tab as that decision should be left to the visitors.

Also Read This πŸ‘‰   Laravel 5.7 Delete Confirm Bootstrap jQuery Model

using jQuery Example

$(document).on('click', 'a', function(e){ 
    e.preventDefault(); 
    var url = $(this).attr('href'); 
    window.open(url, '_blank');
});

PHP Open Hyperlinks in New tab window
PHP Open Hyperlinks in New tab window

using JavaScript(Use window.open():)
var blog = window.open('https://www.yourdomainname.com/', '_blank');
if (blog) {
    //Browser detect has allowed it to be opened
    blog.focus();
} else {
    //Browser has blocked it
    alert('Please allow popups for this Blogspot');
}

Create hidden anchor tag

With jQuery library, you can create new anchor tag like:

$(document).ready(function() {
  $("#findproducts").click(function() {
    $("<a>").prop({
      target: "_blank",
      href: "https://www.yourdomainname.com"
    })[0].click();
  });
});

How to Open URL in New Tab using Jquery?

HTML a href target attribute supports simply as well as tiny way to open the linked URL in the new browser window or tab.

Example 1: jQuery attribute equals selectors

<!DOCTYPE html>
<html>
<head>
    <title>Jquery Open Link in New Tab on Click Example - infinityknow.com</title>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
</head>
<body>

<button class="btn">Click Me</button>
<script type="text/javascript">
    $(".btn").click(function(){

        window.open("https://www.infinityknow.com");

    })
</script>
</body>
</html>

This will instruct the browser Like as a Mozila, Chrome or more to leave the current Live active page as is and open the link in a new tab/window.

Also Read This πŸ‘‰   Live chat code in php with demo and free download : Updated 2021

Example 2: Target _blank alternative

<!DOCTYPE html>
<html>
<head>
    <title>Jquery Open Link in New Tab on Click Example - infinityknow.com</title>
</head>

<body>
	<a href="https://www.infinityknow.com" rel="noopener noreferrer" target="_blank">Click Me</a>
</body>
</html>

You need to use the _blank value in the target attribute to open the linked URL in a new tab or window.

<a href="https://www.pakainfo.com" target="_blank" rel="noopener">Visit pakainfo</a>

using a Specify a class

HTML Code

<a href="/codelp" class="codelp">Read and Write Permmitions</a>

jquery code

$(document).ready(function(){

  $('a.codelp').click(function(){
    window.open(this.href);
    return false;
  });

});

Free Live Chat for Any Issue

The bellow JavaScript simple source code will open https://www.pakainfo.com in a new browser tab or window.

window.open('https://www.pakainfo.com', '_blank');

I hope you get an idea about jquery open link in new window.
I would like to have feedback on my infinityknow.com blog.
Your valuable feedback, question, or comments about this article are always welcome.
If you enjoyed and liked this post, don’t forget to share.