jquery隨機幻燈片循環之前重複

Question

我有以下幻燈片顯示隨機單擊按鈕時幻燈片。不過，我希望在重複之前顯示所有幻燈片，例如：3,1,2,4,5 2,1,4,5,3 - 用戶在重複之前會看到所有幻燈片，而不是現在發生了什麼：2,3,4,2,1,2,4,5用戶已經看過幻燈片3三次，然後纔看到幻燈片5.我想也許使用數組會做到這一點，但我不知道如何執行此操作。任何幫助深表感謝！

var slides = $('div.slide'); 
var rand = Math.floor(Math.random() * slides.length); 
slides.eq(rand).addClass('active'); 

$("a.btn").click(function(event){ 
    event.preventDefault(); 
    var $active = $('#sliderInner div.slide.active'); 

    var $sibs = $active.siblings(); 
    var rndNum = Math.floor(Math.random() * $sibs.length); 
    var $next = $($sibs[ rndNum ]); 


    $next.css('z-index',2);//move the next image up the pile 
    $active.fadeOut(400,function(){//fade out the top image 
     $active.css('z-index',1).show().removeClass('active');//reset the z-index and unhide the image 
     $next.css('z-index',3).addClass('active');//make the next image the top one 
    }); 
}); 

我也試過，但它做同樣的事情：

var slides = $('div.slide'); 
var rand = Math.floor(Math.random() * slides.length); 
slides.eq(rand).addClass('active'); 

$("a.btn").click(function(event){ 
    event.preventDefault(); 

    var grp = $("#sliderInner").children(); 

    Array.prototype.sort.call(grp, function() { 
     return Math.round(Math.random())-0.5; 
    }); 

    $('#sliderInner').empty().append(grp); 

    var $active = $('#sliderInner div.slide.active'); 

    var $next = ($active.next().length > 0) ? $active.next() : $('#sliderInner div:first'); 
    $next.css('z-index',2);//move the next image up the pile 
    $active.fadeOut(400,function(){//fade out the top image 
     $active.css('z-index',1).show().removeClass('active');//reset the z-index and unhide the image 
     $next.css('z-index',3).addClass('active');//make the next image the top one 
    }); 
}); 

Answer 1

沒關係我已經找到了解決辦法，也許不是最優雅，但它的工作原理。如果它是有用的人，將來：

var slides = $('div.slide'); 
var rand = Math.floor(Math.random() * slides.length); 
slides.eq(rand).addClass('active'); 

$("a.btn").click(function(event){ 
    event.preventDefault(); 
    var $active = $('#sliderInner div.slide.active'); 


    var $sibs = $active.siblings().not('.used'); 
    var rndNum = Math.floor(Math.random() * $sibs.length); 
    var $next = $($sibs[ rndNum ]); 

    $next.css('z-index',2);//move the next image up the pile 
    $active.fadeOut(400,function(){//fade out the top image 
     $active.css('z-index',1).show().removeClass('active').addClass('used');//reset the z-index and unhide the image 
     $next.css('z-index',3).addClass('active');//make the next image the top one 
    }); 

    if ($active.siblings().length-1 == $(".used").length) { 
     $('.slide').removeClass('used'); 
     $active.fadeOut(400,function(){//fade out the top image 
      $active.css('z-index',1).show().removeClass('active').removeClass('used'); 
     }); 
     } 


});