简单的级联下拉(作为工作中的一点总结~)

级联下拉(作为工作中的一点总结~)

<script>
	var codeArr = ["请选择","CNY","AUD","JPY","USD","HKD","EUR","GBP"];
	var nameArr = [["请选择"],["人民币"],["澳元"],["日元"],["美元"],["港币"],["欧元"],["英镑"]];
	window.onload = function () {
	     
	    var selCode = document.getElementById("currencyCode");
	    //申请空间
	    selCode.length = codeArr.length;
	    //添加元素
	    for (var i = 0; i < codeArr.length; i++) {
	        selCode.options[i].text = codeArr[i];
	        selCode.options[i].value = codeArr[i];
	    }
	}
	function ChangeNameSelect(index){
	    var selName = document.getElementById("currencyName");
	
	    selName.length = nameArr[index].length;
	
	    for (var i = 0; i < nameArr[index].length; i++) {
	        selName.options[i].text = nameArr[index][i];
	        selName.options[i].value = nameArr[index][i];
	    }
	}
</script>

jsp部分：

<div class="edit_box">
    <div class="edit_item">
         <label class="edit_label"><i class="red">*</i>币别代码：</label>
         <select class="edit_input"  name="currencyCode" id="currencyCode"  onchange="ChangeNameSelect(this.selectedIndex)">
              <option value="0">请选择</option>
              <option value="CNY">CNY</option>
              <option value="AUD">AUD</option>
              <option value="JPY">JPY</option>
              <option value="USD">USD</option>
              <option value="HKD">HKD</option>
              <option value="EUR">EUR</option>
              <option value="GBP">GBP</option>
           </select>
     </div>
     <div class="edit_item">
          <label class="edit_label">币别名称：</label>
          <select class="edit_input"  name="currencyName" id="currencyName"  >
          	<option value="0">请选择</option>
          </select>
      </div>
     <div class="edit_item"></div>
 </div>

    ps:用的是固定数据