-1

我目前正在用html制作一个带有一系列下拉菜单的网页。该网站在这里：http ://tc.met.psu.edu/tcgengifs/index2.html

我正在使用以下代码制作下拉菜单

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript">
       function getUrl() {
              var part12 = document.getElementById("firstChoice2").value;
              var part22 = document.getElementById("secondChoice2").value;
              var part32 = document.getElementById("thirdChoice2").value;
               return "http://tc.met.psu.edu/tcgengifs/CMC/"+part12+"/"+part22+part32;
}
      function gotoSelection() {
         var urlToGoTo = getUrl();
         alert(urlToGoTo);
        //location.href=urlToGoTo;

      function setupLink() {
      var urlToGoTo = getUrl();
      document.getElementById("gotoLink").href=UrlToGoTo;
          }
 </script>
</head>
 <body onload="setupLink();">
<div id=leftcol>
<select id =firstChoice2 onchange="setupLink();">
    <option value=2012072600>2012072600</option>
    <option value=2012072512>2012072512</option>
</select>
</div>
<body>
<div id=leftcencol>
<select id =secondChoice2 onchange="setupLink();">
<option value=rain>Rainfall</option>
<option value=slp>Sea Level Pressure</option>
<option value=850virt>850mb Virtual Temperature</option>
</select>
</div>
<div id=rightcencol>
 <select id =thirdChoice2 onchange="setupLink();">
     <option value=.anim.html>Animation</option>
     <option value=0.png>000hr</option>
     <option value=1.png>006hr</option>
     <option value=2.png>012hr</option>
</select>
</div>
<div id=rightcol>
<a id="gotoLink" href="">Submit</a>

我的问题是我需要多次使用此代码（经过修改），但是当我这样做时，每个系列的 3 个下拉菜单的提交按钮会将我带到最后一段代码旨在将我带到的站点. 如何分隔代码，以便三个下拉列表的第一个系列不受任何其他系列的影响？

4

1 回答 1

0

您的第二个函数 gotoSelection() 缺少右括号，但这不是导致您的问题的原因。

您将 URL 传递回锚点的方式是不正确的尝试；

document.getElementById("gotoLink").setAttribute("href",urlToGoTo);

在您的 setupLink() 函数中替换该行；

document.getElementById("gotoLink").href=UrlToGoTo;
于 2012-07-28T06:50:44.870 回答