5

ユーザーがサムネイル画像をクリックしたときに、画像の URL を含むデータ値を取得しようとしています。HTML は次のとおりです。

<div class="port_image_holder">
<a class="port_enlarge" href="javascript:void(0)">
    <img class="lazy" src="html_includes/include_images/image_loading.jpg"
        data-original="html_includes/include_images/test-image.png"
        data-large="html_includes/include_images/test-image-large.png"
        alt="Caption Goes Here.." />
    <noscript>
        <img src="html_includes/include_images/test-image.png"
             data-large="html_includes/include_images/test-image-large.png"
             alt="" />
   </noscript>
</a>
</div>

基本的に、ユーザーが画像をクリックすると、data-large属性に設定された URL を取得する必要があります。

現在、メソッドsrcを使用してから URL を取得できます。find()

var img_url=$(this).find('img').attr('src');

しかし、これまでのところ、データ参照を取得できていません。port_image_holderこれらは必要に応じてループアウトされるため、ページには多数のクラスがあることに注意してください。

4

1 に答える 1

9

次のような方法data-largeを使用して、画像の属性を見つけることができます。.data()

var img_url = $(this).find('img').data('large');

// Check the console for url
console.log(img_url);
于 2013-06-10T07:58:15.627 に答える