1. 程式人生 > >簡單的級聯下拉(作為工作中的一點總結~)

簡單的級聯下拉(作為工作中的一點總結~)

級聯下拉(作為工作中的一點總結~)

<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:用的是固定資料