问题描述
我正在使用库，并在我的网页上包含以下代码行，这将使我可以随机排列轮播中幻灯片的顺序。
JavaScript / jQuery：
$('.qa').on('init', function(event, slick, currentSlide, nextSlide) {
// Randomize the slides and then run slick slider
$.fn.randomize = function(selector) {
var $elems = selector ? $(this).find(selector) : $(this).children(),
$parents = $elems.parent();
$parents.each(function() {
$(this).children(selector).sort(function(){
return Math.round(Math.random()) - 0.5;
}).detach().appendTo(this);
});
return this;
};
$('.qa').find('.slick-track').randomize('.slick-slide');
});
由于我对JavaScript / jQuery不太熟悉，我如何才能随机化幻灯片的顺序（当前操作）， 除了最后一张（顺序）？
1楼
slick.js添加了一些幻灯片的克隆，因此，我建议您在调用slick()之前将幻灯片随机化。
您还可以保持代码几乎完全与编写代码相同，但是要添加一张支票以防止对最后一张幻灯片进行重新排序*。
查看包含的示例。
$.fn.randomize = function (selector) { var $elems = selector ? $(this).find(selector) : $(this).children(), $parents = $elems.parent(); $parents.each(function () { $(this).children(selector).sort(function (childA, childB) { // * Prevent last slide from being reordered if($(childB).index() !== $(this).children(selector).length - 1) { return Math.round(Math.random()) - 0.5; } }.bind(this)).detach().appendTo(this); }); return this; }; $(".qa").randomize().slick();
<link href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.5.6/slick.min.css" rel="stylesheet"/> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="http://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.5.6/slick.min.js"></script> <div class="qa"> <div>your content 1</div> <div>your content 2</div> <div>your content 3</div> <div>your content 4</div> <div>your content 5</div> <div>your content 6</div> <div>your content 7</div> <div>your content 8</div> <div>I am always last</div> </div>
如果您检查，您会看到最后一张幻灯片总是最后一张。
2楼
我建议您获取除最后一个条目外的所有数组，将其随机化，然后将最后一个条目推入新数组。
关于如何随机播放，请阅读
假设laxt条目是您最后仍要显示的条目，则可以（伪代码）
var array = [allmyelems];
var last = array.pop();
shuffle(array);
array.push(last);
function shuffle(array) {
//function from above link
}