0

私のHTMLは次のようになります。

<div class="wrapper1">
    <div class="field1"></div>
    <div class="field2">
        <img src="" />
    </div>
    <div class="field3">
        <div class="content">Lorum Ipsum</div>
    </div>
</div>

.field3をクリックすると、divのコンテンツにアクセスしたいと思います.field2 img。そして、最小限のコードでそうしたいのですが...

$('.wrapper1 img').click(function(){
    var desc = $(this).find('.field3').html();
    console.log(desc);
});

しかし、何らかの理由で、空のオブジェクトを取得します。field3もちろん、これは理にかなっています (-要素 (この場合は画像)内を探しているためthis) ですが、JQ でこの問題にどのように取り組むことができますか?

4

3 に答える 3

2 
$('.wrapper1 img').click(function(){
    var desc = $(this).parent().siblings('.field3').html();
    console.log(desc);
});
于 2013-06-10T14:45:57.907 に答える
1

findクリックされた要素の子孫を探しますが、field3 は子孫ではありません。直接アクセスできます：

$('.wrapper1 img').click(function(){
    var desc = $('.field3').html();
    console.log(desc);
});

または、親に移動してから検索を使用します。

$('.wrapper1 img').click(function(){
    var desc = $(this).closest('.wrapper1').find('.field3').html();
    console.log(desc);
});

2 番目の方法は階層をナビゲートするので時間がかかりますが、field3クラスに複数の要素があり、クリックした要素と同じwrapper1要素にあるものを選択したい場合に役立ちます。img

于 2013-06-10T14:47:01.387 に答える
0

試す

$('.wrapper1 img').click(function(){
    var desc = $(this).parents(".wrapper1").children('.field3').html();
    console.log(desc);
});
于 2013-06-10T14:47:04.993 に答える