jquery顯示同一類的下一個div？

Question

我有這樣

  <div class="slides"> 
       <div id="box_bg"> 
        <div class="previous"></div> 
        <img src="images/minido_pic.png" width="267" height="252" alt="MiniDo" class="img1" /> 
        <div class="next"></div> 
       </div> 
       <div id="text1"> 
        <p>MiniDo - Adobe Air App - Simplistic design wrapped around a simple iOS style window built for the Windows environment using Adobe Air.</p> 
       </div> 
      </div> 

一堆div的和一堆的jQuery

$(document).ready(function(){ 
    $(".slides").hide(); 

     var length = $(".slides").length; 
     var ran = Math.floor(Math.random()*length); 
     $(".slides:nth-child(" + ran + ")").show(); 

    $('.previous').click(function() { 
     $(".slides").parentsUntil(".slides").prev().show(); 
     $('.slides').hide(); 
    }); 

    $('.next').click(function() { 
     $(this).parentsUntil(".slides").next().show(); 
     $('.slides').hide(); 
    }); 
}); 

的現在我想這樣是在頁面加載，顯示一個隨機的「.slides」工作正常。然後當用戶按下「.next」或「.previous」時，它會加載下一個「.slides」。

但是，我似乎無法得到它的工作？當我按下一個或上一個時，它什麼也不顯示？

任何幫助？

Answer 1

您應該使用

對於以前

$(this).closest('.slides').prevAll('.slides').eq(0).show(); 

且下一次

$(this).closest('.slides').nextAll('.slides').eq(0).show(); 

而且最重要的是隱藏.slides顯示您在下單前。

所以$('.slides').hide();應該是前.show()命令，否則，你只是告訴你想要的，然後隱藏所有（包括一個你剛剛出現）

---

共有

$('.previous').click(function() { 
    $('.slides').hide(); 
    var previous = $(this).closest('.slides').prevAll('.slides').eq(0); 
    if (previous.length === 0) previous = $(this).closest('.slides').nextAll('.slides').last(); 
    previous.show(); 
}); 

$('.next').click(function() { 
    $('.slides').hide(); 
    var next = $(this).closest('.slides').nextAll('.slides').eq(0); 
    if (next.length === 0) next = $(this).closest('.slides').prevAll('.slides').last(); 
    next.show(); 
});