Question

如何让这个脚本插入所有图像，而不仅仅是其中一个？我只是想让它随机插入所有图像。

<script type="text/javascript">
    var images = ['basketball.jpg', 'running.jpg', 'tennis.jpg', 'running-woman.jpg', 'swimming.jpg', 'cycling.jpg'];
$('<img src="images/large/' + images[Math.floor(Math.random() * images.length)] + '">').appendTo('#images');
</script>

Answer 1

要保持插入顺序随机，请使用while循环：

<script type="text/javascript">
    var images = ['basketball.jpg', 'running.jpg', 'tennis.jpg', 'running-woman.jpg', 'swimming.jpg', 'cycling.jpg'];

    while (images.length !== 0) {
        var index = Math.floor(Math.random() * images.length);
        $('<img src="images/large/' + images.splice(index, 1) + '">').appendTo('#images');
    }
</script>

Answer 2

使用需要使用循环来附加所有图像......

<script type="text/javascript">
    var images = ['basketball.jpg', 'running.jpg', 'tennis.jpg', 'running-woman.jpg', 'swimming.jpg', 'cycling.jpg'];

    $.each(images,function(i,v){
     $('<img src="images/large/' + images[i] + '">').appendTo('#images');
    });
</script>

Answer 3

<script type="text/javascript">
    var images = ['basketball.jpg', 'running.jpg', 'tennis.jpg', 'running-woman.jpg', 'swimming.jpg', 'cycling.jpg'];

   for(var i=0;i<images.length;i++)
     $('<img src="images/large/' + images[i] + '">').appendTo('#images');

</script>

Answer 4

您的代码选择一个图像，然后显示它。你需要重构它所以它会多次这样做。

首先，分解行动：

    var images = ... // fill array

    pick = Math.floor(Math.random() * images.length); // choose image

    tag = '<img src="images/large/' + images[pick] + '>'; // make tag

    $(tag).appendTo('#images'); // add tag

然后，设置循环重复直到数组耗尽：

    var images = ... // fill array

    while (images.length>0) {
       pick = Math.floor(Math.random() * images.length); // choose image
       tag = '<img src="images/large/' + images[pick] + '>'; // make tag
       images = images.splice(i,1); // take picked image out of array
       $(tag).appendTo('#images'); // add tag
    }

我没有运行它，检查我用于“拼接”的数组索引是否正确，以取出一个图像并从阵列中取出正确的图像。您还可以获取数组删除功能，例如来自http://ejohn.org/blog/javascript-array-remove/

Answer 5

您可以使用Fisher Yates Shuffle算法在javascript中随机播放图像

您可以将您的图像集合存储在一个数组中。如下面的代码所示，您可以将数组传递给函数并构建您的shuffle :)

def fisherYatesShuffle(array):
if len(array) < 2:
    return

firstElementIndex = uniform(0, len(array))
swap(array[0], array[firstElementIndex])
fisherYatesShuffle(array[1:])

随机播放图片javascript / jquery

5 个答案: