Ziel hinzufügen auf dynamisch hinzugefügte Elemente

Question

Ich bin ein Neuling in jQuery und ich blieb eine Weile mit einem Problem stecken. Ich versuche, alle Links zu einer externen Seite zu finden und ihnen ein Attribut target = "_ blank" hinzuzufügen. Bisher habe ich das folgende Skript erstellt:

$(document).on('load',function() { 
$('a').each(function() { 
    if (location.hostname !== this.hostname) { 
     $(this).attr('target', '_blank'); 
    } 
}); 
}); 

Dies funktioniert gut auf den Elementen, die auf der Seite in der ersten Instanz geladen werden, aber wenn neue Elemente hinzugefügt werden dynamisch es nicht wieder Feuer das Ziel hinzufügen Attribut. Ich habe versucht, die "ready" -Funktion auf "on ('load')" zu ändern, aber ohne Erfolg.

Jede Hilfe wird sehr geschätzt und ich bin dankbar für die Leute, die eine Sekunde brauchen, um dumme Fragen wie diese zu beantworten.

Edit: Ich erstellte und unendlich Scroll-Skript, das mehr Elemente durch einen AJAX-Aufruf lädt. Diese Elemente enthalten "a" -Tags und ich möchte, dass das Skript für sie erneut ausgeführt wird.

Answer 1

ich Ihren Link ändernden Code in einer Funktion einbetten würde die Sie kann a) onload und b) aufrufen, wenn sich Ihr Inhalt ändert.

$(document).ready(function() { 
    linkChanger(); 
}); 

function linkChanger() { 
    $('a').each(function() { 
     if (location.hostname !== this.hostname) { 
      $(this).attr('target', '_blank'); 
     } 
    }); 
} 

dann, wenn Sie später Inhalt/Links hinzufügen, können Sie rufen Linkchanger() zu überprüfen/konvertieren Sie Ihre Seite wieder:

$('#something').click(function() { 
    // code that gets more content, if async provide a callback that calls linkChanger() 
    linkChanger(); 
}); 

Answer 2

Sie müssen diese Funktion immer dann auslösen, wenn Sie neue Elemente hinzufügen. Da Sie am besten wissen, wann neue Links hinzugefügt werden, müssen Sie die Skripts auf diese Weise einrichten.

function setTargetBlank() { 
    $('a').each(function() { 
    if (location.hostname !== this.hostname) { 
     $(this).attr('target', '_blank'); 
    } 
    }); 
} 

// On load 
$(function() { 
    setTargetBlank(); 
    loadSomeContent(function() { 
    // And after it is loaded, trigger again the function 
    setTargetBlank(); 
    }); 
}); 

Wenn Sie diese nicht kontrollieren können, können Sie einfach einen Timer einrichten, die immer diese Funktion alle paar Sekunden auslösen:

// This is not really good for performance, but it will work 
// It will trigger the function every 3 seconds 
setInterval(setTargetBlank, 3 * 1000); 

Answer 3

Es ist möglich, dass Sie die A Links zielen vor dem neuen Elemente wurden erstellt. Versuchen Sie, den Code in einer setTimeout-Funktion auszuführen. zum Beispiel

$(document).on('load',function() {

setTimeout(function(){ $('a').each(function() { if (location.hostname !== this.hostname) { $(this).attr('target', '_blank');
} }); }, 5000);

});