如何在jQuery中使用數據屬性定位？

Question

我創建了一個投資組合，其中每個圖像元素都有一個列表項。 我想要以下內容：單擊圖像，獲取其數據屬性值，然后僅在具有相同數據屬性值的li項目上運行腳本的其余部分。 有點像這樣：

var data1 = $("#portfolio li").data('descriptionid');
var data2 = $('.img-description').data('description');
$('#portfolio li').click(function(){
    $(".img-description").data("img").stop()
    .animate({
        "left" : '0px'
    }, 400);
});

<div id="portfolio">
    <ul>
    <li><img src="img1.jpg" width="320px" data-descriptionid="img1"></li>
    <li><img src="img2.jpg" width="320px"></li>
    </ul>
    </div>
    <div id="idc">
        <ul>
        <li class="img-description" data-description="img1">
            <p>
            Lorem ipsum dolor sit amet, consectetur
            </p>
            </li>
        </ul>
        </div>
</div>

我有一種感覺，變量不應該在外部，當我單擊特定項目時，我需要將數據存儲在變量中。 我該如何進一步？ 謝謝您的幫助。

Answer 1

簡單地說，我建議：

$('#portfolio li').click(function(){
    $('.img-description[data="' + $(this).data('descriptionid') + '"]').stop()
    .animate({
        "left" : '0px'
    }, 400);
});