Obtenir l'attribut "alt" d'une image qui réside à l'intérieur d'un <a> tag

Question

cela devrait être assez simple mais pour une raison quelconque, cela ne fonctionne pas.

Je veux obtenir l'attribut « alt » d'une image qui se trouve dans une balise

<div id="album-artwork"> 
<ul> 
    <li><a href="link to large image"><img src="thumbnail" alt="description of the image" /></a></li> 
    ... 
</ul> 
</div> 



$("#album-artwork a").click(function(e) { 
e.preventDefault(); 

var src = $(this).attr("href"); 
var alt = $(this).next("img").attr("alt"); 


alert(src); // ok! 
alert(alt); //output: undefined 

}); 

idées pourquoi prochaine() ne fonctionne pas? Y a-t-il une meilleure solution là-bas?

Merci à l'avance Marco

Answer 1

C'est parce que l'étiquette d'image est dans la balise ul. next recherche uniquement les tags au même niveau. Vous devrez utiliser

var alt = $(this).children("img").attr("alt"); 

EDIT: inclus le montant supplémentaire "qui manquait

Answer 2

Essayez $(this).find('img') au lieu de sélectionner un élément au sein le lien

Answer 3

Ne .next ramasser. l'élément suivant qui est le prochain Li et pas l'IMG?

Answer 4

Nevermind.Je viens de l'obtenir ... Je me suis rendu compte que le img n'est pas un frère de <a> mais un enfant de <a>

Ceci est la syntaxe correcte

var alt = $(this).children("img").attr("alt"); 

Answer 5

ou

$('img', this).attr('alt'); 

Test: http://jsbin.com/amado4

Answer 6

$(this).find('img').attr('alt'); 

Answer 7

essayer cette testé et son travail !!!

<div id="album-artwork"> 
<ul> 
    <li><a href="javascript:void(0);"><img src="images/ajax-loader.gif" alt="ajax-loader" /></a></li> 
    <li><a href="javascript:void(0);"><img src="images/close.png" alt="close" /></a></li> 
    <li><a href="javascript:void(0);"><img src="images/copy.png" alt="copy" /></a></li> 
</ul> 
</div> 

et le code jQuery est

$(document).ready(function() { 
     $("#album-artwork a").click(function(e) { 
      e.preventDefault(); 

      var src = $(this).attr("href"); 
      //var alt = $(this).next("img").attr("alt"); 
      var alt = $(this).children().attr("alt"); 
      //find function also do the same thing if you want to use. 
      /*var alt = $(this).find("img").attr("alt");*/ 

      alert(src); // ok! 
      console.log(src); // ok! 
      alert(alt); //output: not undefined now its ok! 
      console.log(alt); //output: not undefined now its ok! 
     }); 
    }); 

la fonction children() trouver tous les enfants, mais si vous voulez trouver des enfants spécifiques définissent les enfants nom comme ça children("img")OUchildren("button").