Question

帮派 - 这是我第一次发帖。我是一个JavaScript菜鸟 - 我想我已经找到了应该采取的方向 - 只是不知道如何到达那里。

我有一个三重下拉选择菜单。我想要第三个（最终）选择来揭示一个隐藏的div。我认为我需要使用onchange，getElementById和if语句的组合，我是否走在正确的轨道上？

下拉列表的javascript代码是Philip M's Cut＆amp;来自JavaScriptKit.com的Paste Triple Combo box。那项工作非常精彩。我不会插入我的确切代码，因为类别列表要长得多。

var categories = [];
categories["startList"] = ["Wearing Apparel","Books"]
categories["Wearing Apparel"] = ["Men","Women","Children"];
categories["Books"] = ["Biography","Fiction","Nonfiction"];
categories["Men"] = ["Shirts","Ties","Belts","Hats"];
categories["Women"] = ["Blouses","Skirts","Scarves", "Hats"];
categories["Children"] = ["Shorts", "Socks", "Coats", "Nightwear"];
categories["Biography"] = ["Contemporay","Historical","Other"];
categories["Fiction"] = ["Science Fiction","Romance", "Thrillers", "Crime"];
categories["Nonfiction"] = ["How-To","Travel","Cookbooks", "Old Churches"];

var nLists = 3; // number of select lists in the set

function fillSelect(currCat,currList){
  var step = Number(currList.name.replace(/\D/g,""));
  for (i=step; i<nLists+1; i++) {
    document.forms['tripleplay']['List'+i].length = 1;
    document.forms['tripleplay']['List'+i].selectedIndex = 0;
  }
  var nCat = categories[currCat];
  for (each in nCat) {
    var nOption = document.createElement('option'); 
    var nData = document.createTextNode(nCat[each]); 
    nOption.setAttribute('value',nCat[each]); 
    nOption.appendChild(nData); 
    currList.appendChild(nOption); 
  } 
}

function getValue(L3, L2, L1) {
  alert("Your selection was:- \n" + L1 + "\n" + L2 + "\n" + L3);
}

function init() {
  fillSelect('startList',document.forms['tripleplay']['List1'])
}

navigator.appName == "Microsoft Internet Explorer" ? attachEvent('onload', init, false) : addEventListener('load', init, false); 

</script>

我的HTML是：

<div id="menuSearch">
 <form name="tripleplay" action="">
  <p><select name='List1' onchange="fillSelect(this.value,this.form['List2'])">
   <option selected>-- Topic of Interest --</option>
  </select></p>

  <p><select name='List2' onchange="fillSelect(this.value,this.form['List3'])">
   <option selected>-- Geographic Area --</option>
  </select></p>
  <select id="info"name='List3' onchange="getValue(this.value, this.form['List2'].value, this.form['List1'].value)">
   <option selected >-- Information Type --</option>
  </select>
 </form>
</div>

显示/隐藏的div是：

<div id="modelingCV">list of publications</div>
<div id="groundwaterCV">list of publications</div>
<div id="subsidenceCV">list of publications</div>
<div id="managementCV">list of publications</div>
<div id="qualityCV">list of publications</div>
<div id="wildlifeCV">list of publications</div>

替换最终形式getValue中的onchange选择getElementByID最佳方法吗？并使用某种类型的getValue语句替换javascript函数中的if以指定值？我猜我需要用javascript和CSS隐藏div？我完全偏离了基地吗？

Oy公司。绝对比我能咀嚼这个还要多。任何指导将不胜感激。谢谢你的阅读！

使用基于三重下拉菜单选择的JavaScript显示/隐藏Div

0 个答案: