Jquery Open in new Tab (_blank)

Question

I've setup some Jquery based off other StackOverflow questions/answers. The purpose of this script is that it makes an entire div a link based on any a href tag that is inside that div.

This works fine however I need to set it to _blank to open in a new tab. I've tried the below with no luck.

$(document).ready(function() {
    $(".product-item").click(function() {
        $(this).target = "_blank";
        window.location = $(this).find("a").attr("href");
        return false;
    });
});

EDIT

Thanks for the help but none of these answers actually work. If anyone can paste the full code that actually works, rather than little snippets without testing if it works. Thanks.

EDIT 2

Thanks to kristinalim, for providing a complete working solution.

This has been answered before: http://stackoverflow.com/questions/2827637/how-can-i-open-a-link-in-a-new-window — Ulises, Feb 19 '13 at 05:16
`window.location` **always** refers to the location of the current window. Changing it will affect **only** the current window. — techfoobar, Feb 19 '13 at 05:18
$(".product-item").click(function(){ $(this).find("a").attr("href"); window.open(this); return false; }); — user2085752, Feb 19 '13 at 05:50

score 23 · Accepted Answer · edited May 23 '17 at 10:31

23

Setting links on the page woud require a combination of @Ravi and @ncksllvn's answers:

// Find link in $(".product-item") and set "target" attribute to "_blank".
$(this).find("a").attr("target", "_blank");

For opening the page in another window, see this question: jQuery click _blank And see this reference for window.open options for customization.

Update:

You would need something along:

$(document).ready(function() {
  $(".product-item").click(function() {
    var productLink = $(this).find("a");

    productLink.attr("target", "_blank");
    window.open(productLink.attr("href"));

    return false;
  });
});

Note the usage of .attr():

$element.attr("attribute_name")                   // Get value of attribute.
$element.attr("attribute_name", attribute_value)  // Set value of attribute.

edited May 23 '17 at 10:31

Community

1
1

answered Feb 19 '13 at 05:40

kristinalim

3,459
18
27

Hi Kristina, this seems to be on track. Can you look at the code below and let me know what's wrong. – user2085752 Feb 19 '13 at 05:51
$(document).ready(function(){ $(".product-item").click(function(){ $(this).find("a").target = "_blank"; window.open(this.href); return false; }); }); – user2085752 Feb 19 '13 at 05:51
Thankyou Kristina, that works. 10 Points for fully answering a question :) – user2085752 Feb 19 '13 at 06:07
worked for me :) Thank you – PC. Dec 11 '15 at 18:53
Just what I needed thank you! – crystallove18 Jun 20 '18 at 19:46

score 3 · Answer 2 · answered Feb 19 '13 at 05:15

3

Replace this line:

$(this).target = "_blank";

With:

$( this ).attr( 'target', '_blank' );

That will set its HREF to _blank.

answered Feb 19 '13 at 05:15

ncksllvn

5,699
2
21
28

score 1 · Answer 3 · answered Feb 19 '13 at 05:15

1

you cannot set target attribute to div, becacuse div does not know how to handle http requests. instead of you set target attribute for link tag.

$(this).find("a").target = "_blank";
window.location= $(this).find("a").attr("href")

answered Feb 19 '13 at 05:15

Ravi Gadag

15,735
5
57
83

score 1 · Answer 4 · answered Feb 19 '13 at 05:23

window.location always refers to the location of the current window. Changing it will affect only the current window.

One thing that can be done is forcing a click on the link after setting its target attribute to _blank:

Check this: http://www.techfoobar.com/2012/jquery-programmatically-clicking-a-link-and-forcing-the-default-action

Disclaimer: Its my blog.

Jquery Open in new Tab (_blank)

4 Answers4

Linked