隨機圖片javascript/jquery

如何讓這個腳本插入所有圖像，而不僅僅是其中的一個？我只是想要它隨機插入所有圖像。隨機圖片javascript/jquery

<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>

來源

2013-03-18 Thomas Urup Schjerlund

可能，你需要循環它 – 2013-03-18 09:10:52

請告訴我們你到目前爲止嘗試過什麼。 – 2013-03-18 09:12:02

爲了保持插入順序隨機，使用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>

來源

2013-03-18 09:13:24 Oliver

不客氣，一定要接受，如果這有幫助;）歡呼聲。 – Oliver 2013-03-18 09:24:18

使用需要使用循環追加所有圖像....

<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>

來源

2013-03-18 09:10:40 bipen

這不會以隨機順序添加圖片，請參閱我的答案。 – Oliver 2013-03-18 09:16:33

<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>

來源

2013-03-18 09:11:41 PSR

你的代碼選擇一個圖像，然後顯示它。您需要重構它，以便它多次執行此操作。

首先，打破了操作：

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/

來源

2013-03-18 09:28:52 boisvert

可以使用費舍爾耶茨洗牌算法在javascript洗牌圖像

您可以將您的圖像集合中的數組。由於下面的代碼所示，您可以在陣列傳遞給函數並構建你的洗牌:)

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

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

來源

2013-07-22 11:54:00

隨機圖片javascript/jquery

回答

相關問題