页面上隐藏/显示div的多个实例

Question

如果只有一组要切换的元素，我的div切换脚本可以工作，但是当每页有多个实例时则不行。需要多个div来独立/单独切换。

http://jsfiddle.net/pixeloco/2zCe5/

$(function(){
$('.showFull').click(function() {
    $('.targetDiv').hide();
    $('#div' + $(this).data('target')).show();
});   
});

因为最终代码将通过wordpress循环动态输出，使用data-id的解决方案（例如在此线程中接受的答案How to create multiple instances of show/hide div in jquery?）会吸引我，因为我可以用post id填充它。 / p>

遗憾的是，我没有足够的JS知识来调整解决方案以满足我的需求，希望有人可以帮我指出正确的方向。谢谢！

Answer 1

使用Jquery遍历进入父“storeitem”级别，然后按照自己的方式返回。这样，所有切换都停留在给定的storeitem中：

http://jsfiddle.net/2zCe5/1/

$(function(){
    $('.showFull').click(function() {
        $(this).parents('.storeitem').find('.targetDiv').hide();
        $(this).parents('.storeitem').find('#div' + $(this).data('target')).show();
    });   
});

可能有更优雅的方式来编写它，但这就是这个想法。