2014-02-23 92 views
1

我有圖像庫,我想創建一個JavaScript文件,這樣每次我點擊一個按鈕,它會生成一個目錄,顯示隨機圖像從該目錄4個圖像的Javascript從目錄中隨機圖像

+1

可能的重複http://stackoverflow.com/questions/5809188/script-to-display-an-image-selected-at-random-from-an-array-on-page-load – ambodi

回答

1

你沒有指定如何獲取圖像,所以我猜圖像存儲在一個字符串數組中。 無論如何,你需要的第一件事情當然是某種洗牌算法。

退房此鏈接:http://dzone.com/snippets/array-shuffle-javascript

適應代碼到你的需求:

var arr = [ 
    "http://cdn.sstatic.net/stackoverflow/img/apple-touch-icon.png", 
    "http://img.bananity.com/media/512/512/bananities/8060a5cf4f9eae8ecff79720db58c2dfacf707344fcb.png", 
    "http://www.socialtalent.co/images/blog-content/so-logo.png", 
    "http://www.logoeps.net/wp-content/uploads/2013/06/stackoverflow_logo.jpg", 
    "http://i22.photobucket.com/albums/b302/Creyeknife/SO_concept1.jpg" 
]; 

getRndImgs = function(o,numberOfImgs){ 
    for(var j, x, i = o.length; i; j = parseInt(Math.random() * i), x = o[--i], o[i] = o[j], o[j] = x); 
    return o.slice(0,numberOfImgs-1); 
}; 

所以,你可以稍後致電:

var imagesToShow=getRndImgs(arr,4); 

,並顯示它們的地方

for (var i=0;i<imagesToShow.length;i++) { 

document.getElementById("div_"+i).innerHTML="<img src='"+imagesToShow[i]+"' />" 

} 
+0

爲什麼你使用變量o ,j,x而不僅僅是我? – IslandKing

+0

o是圖像陣列。 i和j用於訪問不同索引中的數組元素。 x是用於交換數組的項目的變量。 – rpax