2013-10-13 33 views
1

我一直在努力工作数小时,试图让这个工作。我想要做的是: 首先,有两个下拉菜单,第一个控制第二个。 然后,我希望能够将每个单独的“第二选择”链接到href。 但是,“第二选择”在一个数组中,我不知道如何将它们访问到html中。请帮忙。如何将链接附加到单个数组项目?

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
     "http://www.w3.org/TR/html4/loose.dtd"> 
    <html> 
    <head> 
    <title>Any Title</title> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 

    <script type="text/javascript"> 

     var firmwares = []; 
     firmwares[1] = ["Sacramento","San Diego","San Francisco","Los Angeles"]; 
     firmwares[2] = ["Cleveland","Akron","Canton","Cincinnati","Columbus"]; 
     firmwares[3] = ["Philadelphia","Pittsburgh","Harrisburgh"]; 
     firmwares[4] = []; 

     function fillSelect(nValue,nList){ 

      nList.options.length = 1; 
      var curr = firmwares[nValue]; 
      for (each in curr) 
       { 
       var nOption = document.createElement('option'); 
       nOption.appendChild(document.createTextNode(curr[each])); 
       nOption.setAttribute("value",curr[each]);   
       nList.appendChild(nOption); 
       } 
     } 
    </script> 

    </head> 
    <body> 
     <form method="post" action=""> 
      <div> 
       <select name='phones' onchange="fillSelect(this.value,this.form['firmwares'])"> 
        <option value="">Select Your State</option> 
        <option value="1">California</option> 
        <option value="2">Ohio</option> 
        <option value="3">Pennsylvania</option> 
        <option value="4">Alaska</option> 
       </select> 
       <select name='firmwares' > 
        <option value="">Select Your City</option> 
       </select> 
      </div> 
     </form> 
    </body> 
    </html> 
+0

如果我理解正确的话,你要根据以往的下拉选项来显示第二个下拉?检查这个答案:[链接](http://stackoverflow.com/questions/6954556/show-a-second-dropdown-based-on-previous-dropdown-选择) – WhatisSober

回答

0

试试这个

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
    "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<title>Any Title</title> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 

<script type="text/javascript"> 

    var firmwares = {}; 
    firmwares[1] = {"Sacramento" : "http://www.abc.com", 
        "San Diego" : "http://www.abc.com", 
        "San Francisco" : "http://www.abc.com", 
        "Los Angeles" : "http://www.abc.com"}; 
    firmwares[2] = {"Cleveland" : "http://www.abc.com", 
        "Akron" : "http://www.abc.com", 
        "Canton" : "http://www.abc.com", 
        "Cincinnati" : "http://www.abc.com", 
        "Columbus" : "http://www.abc.com"}; 
    firmwares[3] = {"Philadelphia" : "http://www.abc.com", 
        "Pittsburgh" : "http://www.abc.com", 
        "Harrisburgh" : "http://www.abc.com"}; 
    firmwares[4] = {}; 

    function fillSelect(nValue,nList){ 

     nList.options.length = 1; 
     var curr = firmwares[nValue]; 
     for (each in curr) 
      { 
      var nOption = document.createElement('option'); 
      nOption.appendChild(document.createTextNode(each)); 
      nOption.setAttribute("value",each);   
      nList.appendChild(nOption); 
      } 

     document.getElementById("gotoCity").style.display = "none"; 
    } 

    function openCity(firmware, city) { 
     var gotoCity = document.getElementById("gotoCity"); 
     gotoCity.href = firmwares[firmware][city]; 
     gotoCity.style.display=""; 
    } 
</script> 

</head> 
<body> 
    <form method="post" action=""> 
     <div> 
      <select name='phones' onchange="fillSelect(this.value,this.form['firmwares'])"> 
       <option value="">Select Your State</option> 
       <option value="1">California</option> 
       <option value="2">Ohio</option> 
       <option value="3">Pennsylvania</option> 
       <option value="4">Alaska</option> 
      </select> 
      <select name='firmwares' onchange="openCity(this.form['phones'].value, this.value)" > 
       <option value="">Select Your City</option> 
      </select> 
      <a id="gotoCity" href="#" style="display:none;">Go</href> 
     </div> 
    </form> 
</body> 
</html> 
+0

谢谢!有效!有没有办法使链接在按钮的命令而不是自动的工作?再一次,谢谢。 – umtek12

+0

@ umtek12根据需要更改代码。希望它对你有用。 – Cary

+0

再次感谢!!!!!!!!!!!!! – umtek12

相关问题