Получите атрибут "alt" из изображения, которое находится внутри тега

это должно быть довольно просто, но по какой-то причине оно не работает.

Я хочу получить атрибут "alt" из образа, который находится внутри тега

<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

});

любые идеи, почему next() не работает? Есть ли лучшее решение?

Спасибо заранее Marco

Ответ 1

Это потому, что тег изображения находится внутри тега ul. next только ищет теги на том же уровне. Вы должны будете использовать

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

РЕДАКТИРОВАТЬ: включил дополнительный ", который отсутствовал

Ответ 2

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

Ответ 3

Попробуйте $(this).find('img') вместо этого выбрать какой-либо элемент в ссылке.

Ответ 4

или

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

Тест: http://jsbin.com/amado4

Ответ 5

Nevermind. Я просто понял... Я понял, что img не является братом <a>, а дочерним элементом <a>

Это правильный синтаксис

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

Ответ 6

Не будет.следующий подобрать следующий элемент, который следующий Ли, а не IMG?

Ответ 7

попробуйте это протестировать и его работу!!!

<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>

и код jQuery

    $(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!
        });
    });

Функция children() найдет любые дочерние элементы, но если вы хотите найти какие-либо конкретные дочерние элементы, определите имя дочерних элементов, подобное этому children("img") ИЛИ children("button").

Ответ 8

Не усложняйте:

$('img').on({
'click': function(){
    echo(this.alt);

}});