2013-03-15 81 views
0

我試圖在click函數中針對某個div的下一個實例。
這裏有一個的jsfiddle:http://jsfiddle.net/wUEkE/1/
的jQuery:jQuery:目標div的下一個實例

$(document).ready(function(){ 

$(".listings-item").click(function() { 
$('.hidden').next($('.hidden').removeClass('hidden').addClass('preview-listing').hide().delay(400).fadeIn("slow")); 
$('#listings-wrap').masonry('reload'); 
}); 

}); 

所以我想要實現的是通過點擊.listing-item將目標的.hidden下一個實例,並改變類,以顯示它在磚石網格。目前,在點擊時,.hidden的兩個實例都被顯示,而不僅僅是相關的下一個實例。我無法弄清楚這是爲什麼。我很快就會把內容添加到這個相關的div中,但現在我只是試圖讓這個工作,我不能。

回答

1

爲此,您可以使用nextAll函數,該函數返回所有下一個兄弟。如果你爲第一個隱藏元素添加一個選擇器,那麼你將得到相對於點擊的div的下一個隱藏元素。

像這樣:

$(this).nextAll('.hidden:first') 

它與你的榜樣,充分利用看起來是這樣的:

$(".listings-item").click(function() { 
    $(this).nextAll('.hidden:first').removeClass('hidden').addClass('preview-listing').hide().delay(400).fadeIn("slow"); 
    $('#listings-wrap').masonry('reload'); 
}); 

Here is you example updated