JQuery - On Click image open separate window

Question

I am trying to open an image in a new tab when user clicks on the thumbnail, but even though I've tried many different solutions none of them worked.

I am posting jquery code:

$('#imagelink').click(function() {

     //location.href = $('#imagelink').attr("href"); //It is correct!
    // window.location.href = this.id + '.html'; //It is correct!
  //  window.open($('#imagelink').attr("href"), '_blank');
  //  $.winOpen($('#imagelink').attr("href"), "windowName", { fullscreen: "no", height: "600px", toolbar:    1, width: 600 }); //It is correct!
     window.location = $.myURL("index", $(this).attr("href"));//It is correct!

    });

As you can see I've tried all of the above five aspects and all of them open the image in the same tab which is not what I desire.

I am posting also the jquery code that includes also the html (this is included in separate file):

new_span.append('<a id="imagelink" href="'+ new.link +'"><img src="' + new.url +'" height=50px width="50px"  /></a>');

Any kind of help is appreciated.

Answer 1

Try with target as _blank like

new_span.append('<a id="imagelink" href="'+ new.link +'" target="_blank"><img src="' + new.url +'" height=50px width="50px"  /></a>');

Or you can also try with javascript using window.open like

$('#imagelink').click(function() {
    var URL = $.myURL("index", $(this).attr("href"));
    window.open(URL,'_blank','',''); 
});

Answer 2

Use :

target="_blank" 

in your a tag.

If you want to follow jquery then use :

$('#imagelink').click(function() {
     var loc = $(this).attr("href");
     window.open(loc, '_blank');
});

Answer 3

Just add the following in the head section of your HTML.

<base target='_blank' />

If you want to open only the links of a particular section of your page then use th e following code

$('#my-Content a[href^="http://"]').attr("target", "_blank");

Here #my-Content is the id of the section in which your links are present. This is for the anchor tags, but it works same with images too.

Answer 4

according to your problem you just need a

target='_blank' //attribute for anchor tag.
new_span.append('<a id="imagelink" href="'+ new.link +'" target="_blank"><img src="' + new.url +'" height=50px width="50px"  /></a>');

even after appending this attribut you don't need explicit click function for it. you are attaching a click function it will open in popup window, some browser or you can say browser setting should be enable for popup. but target='_blank' is enough to open a image in new tab. personally i don't recommend click function if you are providing a link in href.

but because you are newbie for your reference their are more attribute for anchor. that will help you in future.

_blank  Load in a new window
_self   Load in the same frame as it was clicked
_parent Load in the parent frameset
_top    Load in the full body of the window