js實現(xiàn)下拉框二級聯(lián)動

<div class='form-group'>
 <label class='col-md-2 control-label'>題型</label>
 <div class='col-md-2'>
  //通過fn()函數(shù)去改變答案框狀態(tài)的改變
  <select class="form-control input-sm" id="type" onclick="fn()">
    <option value="選擇題">選擇題</option>
  <option value="判斷題">判斷題</option>
  <option value="多選題">多選題</option>
  </select>
 </div>
</div>
 
 
<div class='form-group'>
 <label class='col-md-2 control-label'>正確選項</label>
 <div class='col-md-10'>
//此處寫一個下拉框一個input框，當(dāng)題型為多選時，利用JS將下拉框隱藏，input框顯示
 <input class='form-control' placeholder='正確選項' type='text' name='answerTrue1' id='answerTrue1' type="hidden" data-bv-notempty='true' data-bv-notempty-message='正確答案不能為空'>
 <select class="form-control input-sm" id="answerTrue2" name="answerTrue2">
 <option value="A">A</option>
 <option value="B">B</option>
 <option value="C">C</option>
 <option value="D">D</option>
 </select>
 </div>
</div>

<script type="text/javascript">
//頁面加載時執(zhí)行init函數(shù)，使多選題的正確答案的文本框隱藏
init();
function init（）{
 $("#answerTrue1").hide();
}
 
//題目類型和答案選擇的二級聯(lián)動
 function fn(){
 var type=document.getElementById("type");
 var t=type.value;
 var answer=document.getElementById("answerTrue2");
 switch(t)
 {
  //判斷是選擇題還是判斷題，然后改變下拉框中的內(nèi)容
  case "選擇題": answer.innerHTML="<option>A</option><option>B</option> 
          <option>C</option><option>D</option>";
  $("#answerTrue1").hide();
  $("#answerTrue2").show();
  break;
  case "判斷題":answer.innerHTML="<option>正確</option><option>錯誤</option>";
  $("#answerTrue1").hide();
  $("#answerTrue2").show();
  break;
  default:$("#answerTrue1").show();
  $("#answerTrue2").hide();
 }
 };
</script>