Question

我正试图在4个div中随机切换一些图像，但我遇到了重复结果的问题。尽管有每个例子

1,4,2,3 然后 4,1,3,2

我正在

2,2,4,2然后1,3,3,4

所以我需要找到一个避免重复数字的解决方案

这是代码

var tempo = setInterval(function() {
    $('.pub').each(function(i) {
        var imagens_pubs = ['img_1.jpg', 'img_2.jpg', 'img_3.jpg', 'img_4.jpg'];
        var rand = Math.floor(Math.random()*imagens_pubs.length);
        $(this).html('<a href="http://www.mysite.com" target="_blank"><img src="pubs/'+imagens_pubs[rand]+'" width="220px" height="50px"></img></a>');
    });
}, 5000);

Answer 1

您应该看看如何生成数组的随机排列。 Knuth shuffle算法非常简单，易于实现：

To shuffle an array a of n elements (indices 0..n-1):
  for i from n − 1 downto 1 do
       j ← random integer with 0 ≤ j ≤ i
       exchange a[j] and a[i]

Answer 2

这是因为对于每个.pub，您要从同一个数组中选择一个随机项。最简单的方法是在您选择元素后删除该元素，以停止重复选择。

var tempo = setInterval(function() {
    var imagens_pubs = ['img_1.jpg', 'img_2.jpg', 'img_3.jpg', 'img_4.jpg'];

    $('.pub').each(function() {
        var rand = imagens_pubs.splice(Math.floor(Math.random() * imagens_pubs.length), 1)[0]; // Chose a random element and remove it. See the documentation for Array.splice.

        $(this).html('<a href="http://www.mysite.com" target="_blank"><img src="pubs/' + rand + '" width="220px" height="50px"></img></a>');
    });
}, 5000);

请注意，我们已将imagens_pub的声明移出each()，否则将为每个.pub重新声明数组。

你可以在这里看到这个; http://jsfiddle.net/3xcKb/

避免随机重复的结果？

2 个答案: