显示随机div

时间:2018-02-25 09:29:00

标签: javascript jquery html

我有一个问题,

在Html中

<div class="item ">One</div>
<div class="item">Two</div>
<div class="item">Three</div>
<div class="item">Four</div>
JS中的

var random = Math.floor(Math.random() * $('.item').length);
$('.item').hide().eq(random).show();

我需要在类(item)的div中自动和随机添加类(无活动),但是对于所有div都没有。只有一些div。

现在我的代码只显示1个div,而这不是我想要的。

2 个答案:

答案 0 :(得分:2)

你试试这个:

var random = Math.floor(Math.random() * $('.item').length);
var newrandom = 0;
//alert(random);
if(random==0){//alert(random);
$('.item').hide().eq(random).show();
}else if(random>0){
    $('.item').hide();
  for(var i=1; i<=random; i++){

    newrandom = Math.floor(Math.random() * $('.item').length);
        $('.item').eq(newrandom).show();
  //alert(newrandom);
   }

 }

使用这个你会得到随机的。对于随机时间。

答案 1 :(得分:1)

您可以使用eachtoggleClass

$(".item").each(function () {
    $(this).toggleClass('no-active', Math.random() < 0.5);
});
.no-active { visibility: hidden }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="item ">One</div>
<div class="item">Two</div>
<div class="item">Three</div>
<div class="item">Four</div>