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>