点击一组拇指更改课程

Question

我有一系列的缩略图.一个默认情况下应用了一个活动类"p7_current",它在此图像周围放置一个边框.其他人都有一个"p7_inactive"类,它删除了边框.

我希望如果在这组6个大拇指中,最后一个点击的组具有"p7_current"类,其余的被分配为"p7_inactive".

我怎么能用jquery来解决这个问题？

<div class="p7_postcard_thumbs">
    <a href="#" target="p7_postcard_iframe"><img src="images/p7_pc1.jpg" class="p7_current" /></a>
    <a href="#" target="p7_postcard_iframe"><img src="images/p7_pc2.jpg" class="p7_inactive" /></a>
    <a href="#" target="p7_postcard_iframe"><img src="images/p7_pc3.jpg" class="p7_inactive" /></a>
    <a href="#" target="p7_postcard_iframe"><img src="images/p7_pc4.jpg" class="p7_inactive" /></a>
    <a href="#" target="p7_postcard_iframe"><img src="images/p7_pc5.jpg" class="p7_inactive" /></a>
    <a href="#" target="p7_postcard_iframe"><img src="images/p7_pc6.jpg" class="p7_inactive" /></a>
</div>

Answer 1

$('.p7_postcard_thumbs img').click(function(e){
    $('.p7_postcard_thumbs img').removeClass('p7_current p7_inactive').not(this).addClass('p7_inactive');
    $(this).addClass('p7_current');
});?

jsFiddle例子