Forcing links loaded with Ajax to open in a new tab

Question

I am using this script to force links to Open in a new Window with Jquery, and it works fine

// add external links
function addExternalLinks () { 

$("a[href*='http://']:not([href*='"+location.hostname.replace
       ("www.","")+"']), a.linkException").each(function() {
   if($(this).find('img ').length == 0) {
$(this).click(function(event) {
         event.preventDefault();
         event.stopPropagation();
         window.open(this.href, '_blank');
        }).addClass('externalLink').attr("title", $(this).attr("title")+" - ( This link will open in a new window )");   

        }
   });
}

HOWEVER, part of the page is using content loaded from an external HTML page, using LOAD.

function showInfo( info ) {
$("#layerinfo").load("descriptions.html #" + info );
};

I want the links contained within this loaded content to also be forced to open in a new widow with the same script. I cannot get it to work properly.

Something like :-

function showInfo( info ) {
var infoContent = "descriptions.html #" + info;

$("#layerinfo").load(infoContent,function(){
$("#layerinfo").html().addExternalLinks();
}); 
};

Any help greatly appreciated.

score 1 · Accepted Answer · answered Oct 10 '13 at 11:36

1

addExternalLinks is just a function, not a method of String (which is what .html returns) nor is it a jQuery method to be chained.

$("#layerinfo").load(infoContent, function () {
    addExternalLinks();
});

By the way, for addExternalLinks couldn't you just add .attr("target", "_blank") to said links instead of using a click event?

answered Oct 10 '13 at 11:36

Explosion Pills

188,624
52
326
405

It work locally, but when I upload to a server, the external links do not work on the loaded content . Any ideas ? I adapted the function as per your sugestion :- – naturelab Oct 10 '13 at 12:27
// add external links function addExternalLinks () { $("a[href*='http://']:not([href*='"+location.hostname.replace ("www.","")+"']), a.linkException").each(function() { if($(this).find('img ').length == 0) { $(this).attr("target", "_blank").addClass('externalLink').attr("title", $(this).attr("title")+" - ( This link will open in a new window )"); } }); } – naturelab Oct 10 '13 at 12:28

score 1 · Answer 2 · answered Oct 10 '13 at 11:41

1

try to add attr instead:

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

hope this help!

answered Oct 10 '13 at 11:41

Mufeed Ahmad

485
1
3
17

Forcing links loaded with Ajax to open in a new tab

2 Answers2