Alex Young Alex Young - 25 days ago 8
Javascript Question

UseMap Inserting Data Into Form

I'm just trying to find a tutorial or if someone can point me in the right direction. I'm doing a primary school intranet site and it will have a login but i'm using a usemap on an image and on that image is numbers.

How do i get it so when i click on the image it inserts the value into a text box.

Answer

function setValue(value) {
   document.getElementById('textbox').value = value;
}
<img src="planets.gif" width="145" height="126" alt="Planets" usemap="#planetmap">

<map name="planetmap">
  <area shape="rect" coords="0,0,82,126" href="javascript:setValue('Sun')" alt="Sun">
  <area shape="circle" coords="90,58,3" href="javascript:setValue('Mercury')" alt="Mercury">
  <area shape="circle" coords="124,58,8" href="javascript:setValue('Venus')" alt="Venus">
</map>

<input type="text" id="textbox" />