求助，根据下拉框的值，改变图片

<img src="1.gif">
<form>
<select name="offerState">
      <option value="1" size="6" style="color:#FF9C00;">水晶</option>
      <option value="2" size="6" style="color:#FF9C00;">金属</option>
      <option value="3" size="6" style="color:#FF9C00;">粮食</option>
      <option value="4" size="6" style="color:#FF9C00;">银币</option>
    </select>
</form>
我想实现这么一个效果，当选择水晶的时候，图片显示的1.gif，当选择金属的时候，图片显示2.gif，当选择粮食的时候，图片显示的是3.gif，当选择银币的时候，图片显示的是4.gif这个用js怎么写啊，有没有那位知道，请告知一下，谢谢了

解决方案 »

  1.   

    试试看<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title> new document </title>
        <meta name="generator" content="editplus" />
        <meta name="author" content="Gao YiXiang" />
        <meta name="email" content="[email protected]" />
        <meta name="keywords" content="javascript dhtml dom" />
        <meta name="description" content="I love web development." />
    </head>
    <body>
        <img id="imgShow" src="1.gif">
        <form>
        <select id="sltOpt" name="offerState">
               <option value="1" size="6" style="color:#FF9C00;"> 水晶 </option>
               <option value="2" size="6" style="color:#FF9C00;"> 金属 </option>
               <option value="3" size="6" style="color:#FF9C00;"> 粮食 </option>
               <option value="4" size="6" style="color:#FF9C00;"> 银币 </option>
             </select>
        </form>
    </body>
    <script type="text/javascript">
    <!--
    var oImg = document.getElementById("imgShow");
    oImg.onerror = function()
    {
        this.alt = this.src;
    };var oSlt = document.getElementById("sltOpt");
    oSlt.onchange = function()
    {
        oImg.src = this.value + ".gif";
    };//-->
    </script>
    </html>送你三本手册！DHTML参考手册
    http://download.csdn.net/source/308913样式表中文手册
    http://download.csdn.net/source/304124JScript语言参考
    http://download.csdn.net/source/308916
      

  2.   

    The answer is a little complicated for the question! i think!
      

  3.   

    我还有一个问题，我想在多个地方实现同样的效果，也就是
    var oImg = document.getElementById("imgShow"+i);
    var oSlt = document.getElementById("sltOpt"+i);
    加一个for（i=1;;i++）我应该怎么加，请yixianggao 在给我解答一下好吗，谢谢了