Open link in new tab or new popup window using jQuery

Well, do you know that opening a link in new tab and open link in a new popup window are 2 different things? And to implement both the functionality, One need to use different codes. I had never given this a thought before writing this article but I realized that these are 2 different things (silly mistake). In this post, I will show you how to open a link in new tab and how to open a link a popup window using jQuery.

For example, I have placed 2 hyperlink HTML element on the page. One with ID "Popup" and other one with ID "NewTab".

//Code Starts <a href="http://jquerybyexample.blogspot.com/" id="Popup">     Open in Popup window </a>  <a href="http://jquerybyexample.blogspot.com/" id="NewTab" >     Open in New Tab</a> //Code Ends 

Now, to open link in new Tab, all you need to do is to assign "target=_blank" to the Hyperlink tag.

//Code Starts $(document).ready(function() {    $('#NewTab').click(function() {         $(this).target = "_blank";         window.open($(this).prop('href'));         return false;    }); });​ //Code Ends 

To open link in a new window, create a new object of window. And set focus on it.

//Code Starts $(document).ready(function() {    $('#Popup').click(function() {      var NWin = window.open($(this).prop('href'), '', 'height=800,width=800');      if (window.focus)       {        NWin.focus();      }      return false;     }); });​ //Code Ends 

See result below.

See Complete Code

Feel free to contact me for any help related to jQuery, I will gladly help you.