web-dev-qa-db-ja.com

<a>タグ内にある画像から「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（）が機能しない理由はありますか？そこに良い解決策はありますか？

事前にありがとうマルコ

jquerynext
13
Marco

これは、イメージタグがulタグの内側にあるためです。次に、同じレベルのタグのみを探します。使用する必要があります

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

編集：欠落していた追加の "が含まれています

25
Catfish
$(this).find('img').attr('alt');
7
marko

代わりに$(this).find('img')を試して、要素を選択してくださいwithinリンク。

3
Alec

または

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

テスト：http://jsbin.com/amado4

3
user372551

気にしないで。わかりました... imgは<a>の兄弟ではなく、<a>の子であることに気づきました

これは正しい構文です

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

.nextは次の要素であるIMGではなく次のLiを取得しませんか？

1
Dan

これを試してみて、機能してみてください!!!

_<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")[〜＃〜] or [〜＃〜]children("button")。

1
user2727841

複雑にしないでください：

$('img').on({'click': function(){
    var alt = this.alt;
0
Ivan Laharnar mink.si