Question

我有一些标记：

<div class="slideshow">
    <div class="slide" style="display:block;"></div>
    <div class="slide" style="display:none;"></div>
    <div class="slide" style="display:none;"></div>
    <div class="slide" style="display:none;"></div>
</div>

这基本上是一些显示一个，其他隐藏的div。

我正在尝试找到当前未显示的那些，然后随机选择其中一个......

var length = $('div.slideshow').find('div.slide:hidden').length;

var ran = Math.floor(Math.random()*length) + 1;
var newSlide = $("div.slideshow > div.slide:nth-child(" + ran + ")");

然而，因为它们不止一个隐藏的div它不起作用...我猜我需要设置一个数组？我可以帮助我，因为我有点困惑。

Answer 1

尝试以下，

DEMO

var $hiddenSlides = $('div.slideshow').find('div.slide:hidden');
var length = $hiddenSlides.length;

var ran = Math.floor(Math.random()*length );
var newSlide = $hiddenSlides.get(ran);

Answer 2

这个怎么样：

var $hiddenSlides = $('div.slideshow').find('div.slide:hidden');
var ran = Math.floor(Math.random()*$hiddenSlides.length);
var newSlide = $hiddenSlides.get(ran);

Answer 3

$("div.slideshow > div.slide:nth-child(" + ran + ")"从所有孩子中选择，包括已经可见的孩子。你想要吗？

如果是这样，您必须使用

迭代您的选择

$("div.slideshow > div.slide:nth-child(" + ran + ")").each(function() {
    $(this).show();
});

Answer 4

这应该适合你：

var length = $('div.slideshow').find('div.slide:hidden').length;
var ran = Math.floor(Math.random()*length);
var newSlide = $(".slideshow .slide:hidden:eq(" + ran + ")");

您会在 jsFiddle 中看到输出始终是隐藏的div之一。

Answer 5

解释

它不起作用，因为元素的顺序不能保证，为什么不使用你用来查找隐藏元素的相同选择器迭代元素？

例如：

保存可见元素：

var shownSlide = $("div.slideshow > div.slide:visible");

应用随机遍历：

var ran = Math.floor(Math.random()*length) + 1;
$("div.slideshow > div.slide:hidden:eq(" + ran + ")").show();

重新隐藏可见元素：

$(shownSlide).hide();

查找隐藏的元素并将其存储在数组中

5 个答案:

解释

例如：