Question

我对jQuery很新，我正在尝试旋转6个CSS类

.img
.img1
.img2
.img3
.img4
.img5

这些类中只有一个具有“display：block;”其余的都有“display：none;”。

我试图基本上随机化这些类的外观 - 对于这6个类 - 通过使当前的“display：block”goto“display：none”然后每次页面将另一个类更改为“Display：block”加载？

有人能帮忙吗？

Answer 1

var ran = rand(0,5)
$('.img').hide();
$('.img' + ran).show();

给所有元素2个类1'img'，然后是一个独特的类'img1，img2等'

Answer 2

只需修改所有图片的类别，不包括随机选择的图片。

伪代码：

var img_id = rand(0,5);

for (i=0;i<5; ++i)
{
   if (i!=img_id)
      $("image_"+img_id).class = hiddenclass;
}

Answer 3

你的问题不清楚。

我假设您正在尝试随机显示与其中一个类匹配的所有元素。

您可以通过编写parseInt(Math.random() * 6, 10)生成0到6之间的随机数。

您可以这样写：（并将.img更改为.img0）

var indexToShow = parseInt(Math.random() * 6, 10);

for(var i = 0; i <= 6; i++) {
    if(i === indexToShow)
        $('.img' + i).show();
    else
        $('.img' + i).hide();
}

如果您创建另一个类（例如，.img）并将其添加到所有元素，您可以使其更简单：

$('.img').hide();
$('.img' + parseInt(Math.random() * 6, 10)).show()

Answer 4

选择一个要显示，然后将它们全部隐藏，按要显示的类进行过滤，然后显示它。如果你给他们所有的共同课程会更容易，比如说img以便更容易进行全球选择。

var showClass = '.img' + parseInt(Math.random() * 6, 10);

$('.img').hide().filter(showClass).show();

Answer 5

您可以使用JQuery随机化您的样式。在CodePen上查看此示例： http://codepen.io/aziev/pen/xwpREN

// put in this array your classes
classes = ['class1', 'class2', 'class3'];

max = classes.length - 1;
currentClass = Math.round(Math.random() * max);

// change '.block' to selector of your element
$('.block').addClass(classes[currentClass]);

使用Jquery随机化CSS类

5 个答案: