随机显示一组图像？

Question

我有一些图片：

我想使图像以随机的顺序每次有人刷新页面。

基本上，图像应切换点每次有人刷新。

我该怎么做？我已经搜索，但似乎无法找到多少。

我也希望图像链接到一个网站。

顺便说一句，我用我的页面布局的Smarty。

Answer 1

您可以使用数组来做到这一点。但是，您必须对此阵列使用shuffling方法。然后，您可以浏览新的随机数组以创建HTML字符串。你可以这样来做：

//https://stackoverflow.com/questions/2450954/how-to-randomize-shuffle-a-javascript-array 
 
Array.prototype.shuffle=function(){var i=this.length,j,temp;if(i==0)return this;while(--i){j=Math.floor(Math.random()*(i+1));temp=this[i];this[i]=this[j];this[j]=temp}return this} 
 

 
var images = [ 
 
    {url: "1.gif", link: "http://www.google.com"}, 
 
    {url: "2.gif", link: "http://www.youtube.com"}, 
 
    {url: "3.gif", link: "http://www.facebook.com"} 
 
]; 
 
var imagesShuffle = images.shuffle(); 
 

 
var elementParent = document.querySelector("#images"); 
 

 
imagesShuffle.forEach(function(image){ 
 
    elementParent.innerHTML += '<div class="imageItem"><a href="'+image.link+'"><img src="'+image.url+'" alt="'+image.url+'"></a></div>' 
 
})

#images{background:#BC4F0A; width:200px} 
 

 
#images .imageItem {border-bottom:1px solid black} 
 

 
#images .imageItem a {display:block;padding:15px 10px; }

<div id="images"></div>

Answer 2

您可以使用这样的事情：

<script type="text/javascript"> 


window.onload = function() { 
    randomlinks(); 
}; 

function randomlinks(){ 
    var myrandom=Math.round(Math.random()*9) 
    var links=new Array() 
    links[0]="http://www.iamurl.xyz/1.jpg" 
    links[1]="http://www.iamurl.xyz/2.jpg" 
    links[2]="http://www.iamurl.xyz/3.jpg" 
    links[3]="http://www.iamurl.xyz/44.jpg" 
    links[4]="http://www.iamurl.xyz/43.jpg" 
    links[5]="http://www.iamurl.xyz/12.jpg" 
    links[6]="http://www.iamurl.xyz/11.jpg" 
    links[7]="http://www.iamurl.xyz/11.jpg" 
    links[8]="http://www.iamurl.xyz/133.jpg" 
    links[9]="http://www.iamurl.xyz/112.jpg" 
    links[10]="http://www.iamurl.xyz/111.jpg" 


    window.location=links[myrandom] 
} 
</script>