从阵列中随机选择图像

Question

我在目录中有图像，我正在尝试使用jQuery将它们随机分配给列表项。我有它工作，但我不想重复图像，如果他们已经使用过。这是我的jquery：

var images = ['1.jpg', '2.jpg', '3.jpg', '4.jpg', '5.jpg', '6.jpg', '7.jpg', '8.jpg', '9.jpg', '10.jpg'];

$("#collageWrap li").each(function() {
    $('<img src="images/mosaic/' + images[Math.floor(Math.random() * images.length)] + '">').appendTo($(this));
});

如果我有10个图像和20个列表项，那么想法是在前10个列表项上使用10个图像，然后其余的将留空。如何更改此代码以确保每个图像仅使用一次？

Answer 1

解决方案是在随机拍摄图像时从源阵列中删除：

$("#collageWrap li").each(function() {
    var index = Math.floor(Math.random()*images.length);
    var img = images.splice(index, 1)[0];
    $('<img src="images/mosaic/' + img + '">').appendTo($(this));
    return images.length>0;
});