随机显示2组不同的图像

Displaying 2sets of different images randomly

本文关键字:图像 显示 2组 随机      更新时间:2023-09-26

我有两组不同的图像。

第一组是:img1.jpg、img2.jpg、img3、jpg

第二组是:imga.jpg、imgb.jpg、imgc.jpg

我还有三个不同的div,一,二,三。

每一组图像都必须遵循顺序。img1.jpg必须嵌入div#1,img2.jpg必须嵌入div#2&img3.jpg必须嵌入到div#3中。

同样的事情也必须发生在第二组图像上。但是图像集会随机变化。

我想随机显示图像集。也就是说,当用户登录时,他们可能会看到第一组图像,刷新后,他们可能看到第二组图像。

注意:我不允许使用css"背景图像"

提前感谢

您可以尝试使用Math.random()动态地在图像集之间做出决定,然后使用随机选择的一个来显示您的图像:

var arr1 = ["1.jgp", "2.jgp", "3.jgp"];
var arr2 = ["4.jgp", "5.jgp", "6.jgp"];
var currentArr = Math.random() < 0.5 ? arr1 : arr2;
$.each(currentArr, function(i, val){
  $('#yourContainer').append('<img src="'+val+'"/>');
});

第1版:

如果你有两个以上的阵列,你可以尝试这样的方法:

var arrays = [arr1, arr2, ...];
var currentArr = arrays[Math.floor(Math.random() * arrays.length)];