5

次のhtmlがある場合:

<div class="showPin">
    <div class="pinIt" style="display: none;">
        <a href="#" onclick="window.open(&quot;http://pinterest.com/pin/create/button/?url=http://mysite.com/some-post&amp;description=Some Description&amp;media=http://mysite.com/path/to/myimage.jpg&quot;,&quot;Pinterest&quot;,&quot;scrollbars=no,menubar=no,width=600,height=380,resizable=yes,toolbar=no,location=no,status=no&quot;);return false;"><img src="images/pinbutton.jpg" class="pinbuttonImg"></a>
    </div>
    <a href="myimage.jpg">
        <img class="lazy data-lazy-ready" src="myimage.jpg" data-lazy-type="image" data-lazy-src="http://dev.papermusepress.com/stageblog/wp-content/uploads/2012/11/Fall_baby_shower_mantle2.jpg" alt="Fall Baby Shower Mantle" width="700" height="393" style="display: inline;">
    </a>
</div>

アラート機能を機能させるにはどうすればよいですか。これにより、固定されている実際の画像である img src にアラートが送信class="lazy"されます。

$('div.pinIt').click(function() {
    var url = $(this).closest('img.lazy').attr('src');      
    alert(url);
});

それが私に警告するのはundefined. 私は何を間違っていますか?

4

2 に答える 2

10
$('div.pinIt').click(function() {
    var url = $(this).next('a').find('img.lazy').attr('src');      
    alert(url);
});

最も近いtraverses thru the ancestors。しかし、画像はdivsibling(anchor tag)の中にあります。では、この方法で試してみてください..

使用したい場合は.closest()、これでうまくいくはずです..

$('div.pinIt').click(function() {
        var url = $(this).closest('.showPin').find('img.lazy').attr('src');      
        alert(url);
    });
于 2012-12-03T22:31:21.247 に答える
2

最も簡単な方法の 1 つは、親に移動して内部のイメージ要素を検索することです。

$("div.pinIt").click(function() {
    var url = $(this).closest("div.showPin").find("img.lazy").attr("src");
    alert(url);
});
于 2012-12-03T22:30:56.627 に答える