javascript下拉列表 - 无法添加链接

时间:2013-11-20 16:24:10

标签: javascript

我创建了一个更改图像的基本下拉列表。我试图让每个图像链接到所需的链接并更改相邻表格单元格中的文本,但我正在努力做到这一点。这是示例代码。

    <img src="http://www.khl.com/other_files/khl/dealer-locatot.gif" width="300"  border="0" usemap="#Map" longdesc="http://www.khl.com/other_files/khl/dealer-locatot.gif">
    <map name="Map">
        <area shape="rect" coords="8,11,127,88" href="http://www.scranet.org/" target="_blank" alt="SC&amp;RA">
    </map>

    <script language="JavaScript" type="text/javascript"> 
        ImgPath='http://www.vicsjavascripts.org.uk/StdImages/'; 
        ImgPreloadAry=new Array('One.gif','Two.gif','Three.gif','Four.gif'); 
        SRCAry=new Array(); 

        for (i=0;i<ImgPreloadAry.length;i++){ 
            SRCAry[i]=new Image(); 
            SRCAry[i].src=ImgPath+ImgPreloadAry[i]; 
        } 

        function Cng(sel){ 
            document.getElementById('img').src=ImgPath+sel.options[sel.selectedIndex].value; 
            document.getElementById('tbl').style.backgroundImage='url('+(ImgPath+sel.options[sel.selectedIndex].value)+')'; 
        } 
        //--> 
    </script> 
</head> 

<body> 
    <table width="300" border="0" cellspacing="0" cellpadding="0">
        <tr>
            <td width="149"><img src="http://www.khl.com/other_files/khl/dealer-locatot.gif" alt="" width="130" height="80" id=img></td>
            <td width="151">Related text goes here - along with link to pdf</td>
        </tr>
    </table>
    <p>
        <table width="149" border="0" cellspacing="0" cellpadding="0">
            <tr>
                <td width="149" align="left" valign="top">
                    <select name="Sel" size="1" onchange="Cng(this);" >
                        <option value="One.gif">Company 1</option>
                        <option value="Two.gif">Company 2</option>
                        <option value="Three.gif">Company 3</option>
                        <option value="Four.gif">Company 4</option>
                    </select>
                </td>
            </tr>
        </table>
    <p>

1 个答案:

答案 0 :(得分:1)

我看错了:

  1. 函数Cng永远不会被称为
  2. 函数Cng在“img”上使用getElementById,它在DOM中有相应的id,但是不在引号中,所以可能不起作用,而“tbl”在DOM中看不到id。每个页面的ID都是唯一的,因此使用唯一的标识符对于ID来说要好得多。