0

次のようなマークアップがあります。

<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>

これは基本的に、1 つが表示され、他が非表示の div です。

現在表示されていないものを見つけて、そのうちの1つをランダムに選択しようとしています...

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 であるため、機能しません...配列をセットアップする必要があると思いますか? 私は少し混乱しているので、誰かが私をここで助けてくれますか。

4

5 に答える 5

3

以下を試してください、

デモ

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

var ran = Math.floor(Math.random()*length );
var newSlide = $hiddenSlides.get(ran);
于 2012-04-05T14:58:32.953 に答える
1

これはどう：

var $hiddenSlides = $('div.slideshow').find('div.slide:hidden');
var ran = Math.floor(Math.random()*$hiddenSlides.length);
var newSlide = $hiddenSlides.get(ran);
于 2012-04-05T15:02:15.963 に答える
0

$("div.slideshow > div.slide:nth-child(" + ran + ")"すでに表示されている子を含め、すべての子から選択します。あなたはそれが欲しいですか？

もしそうなら、あなたはあなたの選択を繰り返す必要があります

$("div.slideshow > div.slide:nth-child(" + ran + ")").each(function() {
    $(this).show();
});
于 2012-04-05T14:57:35.450 に答える
0

これはあなたのために働くはずです：

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 の 1 つであることがわかります。

于 2012-04-05T15:00:48.643 に答える
0

説明：

要素の順序が保証されていないため、機能しません。非表示の要素を見つけるために適用したのと同じセレクターを使用して要素を反復処理してみませんか?

例：

可視要素を保存します。

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();
于 2012-04-05T15:01:54.420 に答える