8

我为我的一位艺术家朋友创建了一个网站,她希望布局保持不变,但她也希望将她制作的新画作混合到当前布局中。所以我在主画廊页面上有 12 个缩略图(thumb1 - thumb12)和 18 个图像(img1 - img18)要放置

我想到的方法是创建一个包含所有图像的数组,将其随机化,然后简单地刮掉前 12 个图像并将它们加载到拇指槽中。另一种方法是从数组中随机选择 12 个图像。在第一种情况下,我找不到随机化数组元素的方法。在后一种情况下,我无法思考如何防止图像多次加载,除了使用第二个数组,这似乎非常低效和可怕。

顺便说一句,我正在用 Javascript 完成所有这些工作。

4

4 回答 4

18

我前一阵子写了这篇文章,它恰好适合你正在寻找的东西。我相信 ojblass 指的是 Fisher-Yates 洗牌:

Array.prototype.shuffle = function() {
   var i = this.length;
   while (--i) {
      var j = Math.floor(Math.random() * (i + 1))
      var temp = this[i];
      this[i] = this[j];
      this[j] = temp;
   }

   return this; // for convenience, in case we want a reference to the array
};

请注意,修改 Array.prototype 可能被认为是错误的形式。您可能希望将其实现为将数组作为参数的独立方法。无论如何,要完成它:

var randomSubset = originalArray.shuffle().slice(0,13);

或者,如果您不想实际修改原始文件:

var randomSubset = originalArray.slice(0).shuffle().slice(0,13);
于 2009-05-02T01:41:55.583 回答
6

您应该实现Fisher-Yates shuffle(也称为 Knuth shuffle)。

看看这里提供的很好的答案。

于 2009-05-02T01:36:14.490 回答
1

你的第一种方法会奏效。只需洗牌 18 个元素并取前 12 个元素。

于 2009-05-02T01:38:16.747 回答
1

我最近自己也遇到了这个问题。这里的帖子有帮助:http ://waseemsakka.com/2012/02/14/javascript-dropping-the-last-parts-of-an-array-and-randomizing-the-order-of-an-array/ 。

基本上,从随机化你的数组开始:

thumbs.sort(function(a, b) {
     return Math.random() - 0.5;
})

这将随机化 18 个元素的顺序。然后只保留前 12 个元素,您只需删除最后 6 个:

thumbs.length = 12;
于 2012-02-28T11:55:19.747 回答