Question

我正在試圖用JS（這不是我強大的套裝）。我已經安裝，可以在這裏看到一個小提琴：fiddle

下面是我使用的代碼：

function find_select(){ 
if (document.getElementById("nsp").selected == true) 
{ 
    document.getElementById('nsp_form').style.display = 'block'; 
    document.getElementById('feedback_form').style.display = 'none'; 
} 
else if (document.getElementById("feedback").selected == true) 
{ 
    document.getElementById('nsp_form').style.display = 'none'; 
    document.getElementById('feedback_form').style.display = 'block'; 
} 
else if (document.getElementById("pre_alerts_yes").selected == true) 
{ 
    document.getElementById('nsp_form').style.display = 'block'; 
    document.getElementById('pre_alerts_yes').style.display = 'block'; 
    document.getElementById('feedback_form').style.display = 'none'; 
} 

else{ 
    document.getElementById('nsp_form').style.display = 'none'; 
    document.getElementById('feedback_form').style.display = 'none'; 
} 
} 

我想什麼有發生的情況是，當有人選擇「發送預先警報」選項，然後再打開一個下拉框，其中顯示發送預警選項的類型。但我失敗了，在得到它這樣做，特別是在：

if (document.getElementById("pre_alerts_yes").selected == true) 

這是否需要檢查NSP對話框打開爲好，因爲如果被打開，選擇了NSP框中pre_alerts_yes只顯示真正。對於冗長的寫作抱歉，但需要理解它。

基本上是一個鏈式選擇方法正在進行，可能出現3個級別的下降。也許一組新的眼睛可以告訴我我做錯了什麼，因爲最後的「pre_alerts_yes」不會展開最後一個框。

Answer 1

，如果你想打開pre_alerts_yes你必須表明nsp_form首先是因爲pre_alerts_yes下nsp_form div這是OS display:none;第一使它display:block;

Answer 2

剛剛嘗試命名ID和像

使用jQuery使用的東西的不同

<label for="input_title">Phone Type:</label> 
<select name="phone_type" id="select_form" class="input-block-level" > 
    <option id="blank" value="blank"></option> 
    <option id="blank" value="house">House Phone</option> 
    <option id="nsp" value="cellphone">Normal Cell (Non Smart Phone)</option> 
    <option id="feedback" value="smartphone">SmartPhone</option> 
</select> 
<div id="nsp_form" style="display: none;"> 
    <label for="input_title">Send Pre-Alerts:</label> 
    <select name="pre_alerts" id="pre_alerts_yes_open" class="input-block-level" > 
     <option id="blank" selected="selected"></option> 
     <option value="pre_alerts_yes">Yes</option> 
     <option value="normal_cell">No</option> 
    </select> 

    <div id="pre_alerts_yes_form" style="display: none;"> 
     <label for="input_title">Pre-Alerts Type:</label> 
     <select name="pre_alerts" id="pre_alerts_from" class="input-block-level" > 
      <option value="pre_alerts_yes">Yes</option> 
      <option value="normal_cell">No</option> 
     </select> 
    </div> 

    <label for="input_title">Alert Type:</label> 
    <select name="cell_type" class="input-block-level"> 
     <option value="house">SMS Message (Standard)</option> 
     <option value="normal_cell">SMS Message (Customized)</option> 
     <option value="smart_phone">Phone Call (Standard Voice)</option> 
     <option value="smart_phone">Phone Call (Customized Voice)</option> 
     <option value="smart_phone">Phone Call (Audio Call)</option> 
     <option value="smart_phone">Phone Call (Audio Prompt Call)</option> 
    </select> 
</div> 
<div id="feedback_form" style="display: none;">feedback</div> 

和jQuery這樣

<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script> 
<script type="text/javascript"> 
    $('#select_form').on('change',function() 
    { 
     if ($(this).val() == 'cellphone') { 
      $('#nsp_form').show(); 
      $('#feedback_form').hide(); 
     } else if ($(this).val() == 'smartphone') { 
      $('#nsp_form').hide(); 
      $('#feedback_form').show(); 
     } else { 
      $('#nsp_form').hide(); 
      $('#feedback_form').hide();   
     } 
    }); 

    $('#pre_alerts_yes_open').on('change',function(){ 
     if ($(this).val() == 'pre_alerts_yes') { 
      $('#nsp_form').show(); 
      $('#feedback_form').hide(); 
      $('#pre_alerts_yes_form').show(); 
     } else { 
      $('#nsp_form').hide(); 
      $('#feedback_form').hide(); 
     } 
    }); 
    <script>