Question

J'utilise ceci pour ouvrir les liens sortants dans une nouvelle fenêtre, mais lorsque la cible est une image, je veux afficher l'image alt comme titre.

$("a[href*='http://']:not([href*='"+location.hostname+"']), 
    [href*='https://']:not([href*='"+location.hostname+"'])") 
      .addClass("external") 
      .attr("target","_blank") 
      .attr("title", "Open link in new window"); 
     }); 

Quelle est la manière la plus simple d'ajouter ceci au fichier .attr ("title")?

Answer 1

Si le <img> est à l'intérieur de l'ancrage, vous pouvez le faire comme ceci;

$("a[href*='http://'], a[href*='https://']").not("[href*='"+location.hostname+"']").each(function() { 
    var $this = $(this).addClass("external").attr("target","_blank"); 
    var img = $this.children('img[alt]'); 
    $this.attr("title", img.length ? img[0].alt : "Open link in new window"); 
}); 

Il y a quelques changements ici, votre sélection actuelle regarde seulement <a> dans le premier http:// chèque, mais regarde alors tous éléments dans votre https:// chèque, donc ce sera beaucoup plus efficace. Ensuite, nous vérifions si l'élément courant a un <img> à l'intérieur, si c'est le cas et qu'il a un attribut alt, nous l'utilisons, sinon nous lui donnons le titre par défaut.

Ou, une autre méthode, utiliser ce que vous avez (changer le sélecteur pour être efficace si) et mettre ensuite les titres des ancres qui contiennent des images, comme ceci:

$("a.external > img[alt]").each(function() { 
    $(this).parent().attr("title", this.alt); 
}); 

Answer 2

De ce que cela ressemble, vous sont liés à une image que vous souhaitez afficher dans une fenêtre externe. Lorsque vous utilisez une image en tant que cible d'une balise d'ancrage, elle fait référence au fichier image réel et non à l'élément img. Par conséquent, aucune balise alt ne lui est associée. Si, d'autre part, l'image est contenue dans l'ancre et que vous cliquez dessus pour ouvrir une nouvelle fenêtre, la solution de Nick devrait faire l'affaire. .