link images to web link

问题

Firstly, I am not a web designer and I have very limited knowledge of html, css, javascript etc.

I am running a script which displays a random image each time the page is refreshed. I would like to know, how I can set a click through link that allows the user to click on the random image and follow through to another web page.

The script im using is below. Ideally, I'd like to be able to click on the image and then be sent to a definition of the word.

For example, when "expose.png" is shown, id like to be able to click on the image and be taken to, http://oxforddictionaries.com/definition/english/expose?q=expose

please help.

<a href="javascript:document.location.reload();"
ONMOUSEOVER="window.status='Refresh'; return true">
<img src="Graphic-design-can-[TEST].png" width="auto" height="auto"//>
</a>

</div>




<div id="outcome">

<script language="JavaScript">

function random_imglink(){
var myimages=new Array()

myimages[1]="expose.png"
myimages[2]="inform.png"
myimages[3]="explain.png"
myimages[4]="formulate.png"
myimages[5]="record.png"
myimages[6]="mediate.png"
myimages[7]="design.png"
myimages[8]="persuade.png"
myimages[9]="summarise.png"
myimages[10]="generate.png" 


var ry=Math.floor(Math.random()*myimages.length)
if (ry==0)
ry=1
document.write('<img src="'+myimages[ry]+'" border=0>')
}
random_imglink()

</script>

回答1:

You can do like this...

</div>




<div id="outcome">

<script language="JavaScript">

function random_imglink(){
var myimages=new Array()

var mylink=new Array()

myimages[1]="expose.png"
mylink[1]="www.atrein.com"
myimages[2]="inform.png"
mylink[2]="www.atrein.ir"
myimages[3]="explain.png"
mylink[3]="www.apadana-business.com"
myimages[4]="formulate.png"
mylink[5]="www.google.com"



var ry=Math.floor(Math.random()*myimages.length)
if (ry==0)
ry=1
document.write('<a href="'+mylink[ry]+'" ><img src="'+myimages[ry]+'" border=0> </a>')
}
random_imglink()

</script>

回答2:

You can do something similar to this, identical procedure as the image tags,

<a href="javascript:document.location.reload();"
ONMOUSEOVER="window.status='Refresh'; return true">
<img src="Graphic-design-can-[TEST].png" width="auto" height="auto"//>
</a>

</div>

<div id="outcome">

<script language="JavaScript">

function random_imglink(){
var myimages=new Array()
var myurls=new Array()

myimages[1]="expose.png"
myimages[2]="inform.png"
myimages[3]="explain.png"
myimages[4]="formulate.png"
myimages[5]="record.png"
myimages[6]="mediate.png"
myimages[7]="design.png"
myimages[8]="persuade.png"
myimages[9]="summarise.png"
myimages[10]="generate.png" 

myurls[1]="http://google.com"
myurls[2]="http://stackoverflow.com"
.....
....


var ry=Math.floor(Math.random()*myimages.length)
if (ry==0)
ry=1
document.write('<a href="'+myurls[ry]+'"><img src="'+myimages[ry]+'" border=0 id="'+myimages[ry]+'" onClick="'+dosomething(myimages[ry])+'") /></a>')
}

random_imglink()

function dosomething(myimage)
{
      switch(myimage)
      {
             case 'expose.png':
                     p = document.createElement("p");

                     img = document.createElement("img");
                     img.id="minutesTens";
                     img.src = "1.gif";
                     p.appendChild(img);
                     break;

             case 'inform.png':
                     p = document.createElement("p");

                     img = document.createElement("img");
                     img.id="minutesTens";
                     img.src = "2.gif";
                     p.appendChild(img);
                     break;
              case.....
              ..........
              ..........

 }

</script>

What this code says: The image which is being created with the document.write function will contain the ID and a event call "onClick". The function onClick() will be called with the parameter "ID". Where the ID of the current image will be passed.

The dosomething() function get the ID of the image and set the next image according to the switch case statements. I hope it is clear now. Hope it helps.

来源：https://stackoverflow.com/questions/15614560/link-images-to-web-link