如何根据从Struts 1.3框架中的下拉列表中选择的特定值在JSP页面中显示隐藏的复选框字段？

Question

我想用Nested Tags创造Struts 1.3 framework一个复选框，Javascript等，当用户从选择dropdown选择特定值和checkbox的价值应该得到复位，当用户从dropdown选择其他的值应该只显示。

Answer 1

当你还没有发布你的代码我设法我自己的，试图用JavaScript
提供答案

jsFiddle

$(document).ready(function() { 
 
    $(function() { 
 
     $("#id-select").change(function(){ 
 
      \t var $this = $(this); 
 
      $('input[type=checkbox]').each(function(){ 
 
      \t if($(this).val() == $this.val()) { 
 
       \t 
 
       $(this).parent().siblings().css('display', 'none'); 
 
       \t $(this).parent().css('display', 'block'); 
 
       
 
       \t $('input[type=checkbox]').css('display', 'none'); 
 
       \t $(this).css('display', 'block'); 
 
       } 
 
      }) 
 
      }); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<select id='id-select'> 
 
    <option value="">Select</option> 
 
    <option value="volvo">Volvo</option> 
 
    <option value="saab">Saab</option> 
 
    <option value="opel">Opel</option> 
 
    <option value="audi">Audi</option> 
 
</select> 
 
<br> 
 
<div> 
 

 
<label for="volvo" style='display:none;'> 
 
    <input type="checkbox" id="volvo" value="volvo" style='display:none;'> 
 
volvo</label> 
 

 
<label for="saab" style='display:none;'> 
 
    <input type="checkbox" id="saab" value="saab" style='display:none;'> saab</label> 
 
    
 
<label for="opel" style='display:none;'> 
 
    <input type="checkbox" id="opel" value="opel" style='display:none;'> opel</label> 
 
    
 
<label for="audi" style='display:none;'> 
 
<input type="checkbox" id="audi" value="audi" style='display:none;'> 
 
audi</label> 
 

 
</div>

UPDATE你好@Arvind我有改变了这种与JavaScript工作，
可能很多需要改进的，我做JavaScript

function showCheckBox($this) { 
 
\t var cols = document.getElementsByClassName('class-label'); 
 
    for(i=0; i<cols.length; i++) { 
 
     cols[i].style.display = 'none'; 
 
    } 
 
    var cols = document.getElementsByClassName('class-cb'); 
 
    for(i=0; i<cols.length; i++) { 
 
     cols[i].style.display = 'none'; 
 
     cols[i].checked = false; 
 
    } 
 
\t var array = document.getElementsByTagName("input"); 
 
    for(var ii = 0; ii < array.length; ii++) 
 
    { 
 
    if(array[ii].type == "checkbox") 
 
    { 
 
     if(array[ii].value == $this.value) 
 
     { 
 
      array[ii].style.display = 'block'; 
 
      array[ii].parentElement.style.display = 'block'; 
 
     } 
 
    } 
 
    } 
 
}

<select id='id-select' onchange="showCheckBox(this);"> 
 
    <option value="">Select</option> 
 
    <option value="volvo">Volvo</option> 
 
    <option value="saab">Saab</option> 
 
    <option value="opel">Opel</option> 
 
    <option value="audi">Audi</option> 
 
    <option value="option1">option1</option> 
 
    <option value="option2">option2</option> 
 
</select> 
 

 
<div> 
 

 
<label for="volvo" class='class-label' style='display:none;'> 
 
    <input type="checkbox" class='class-cb' id="volvo" value="volvo" style='display:none;'>volvo 
 
</label> 
 

 
<label for="saab" class='class-label' style='display:none;'> 
 
    <input type="checkbox" class='class-cb' id="saab" value="saab" style='display:none;'> saab 
 
</label> 
 
    
 
<label for="opel" class='class-label' style='display:none;'> 
 
    <input type="checkbox" class='class-cb' id="opel" value="opel" style='display:none;'>opel 
 
</label> 
 
    
 
<label for="audi" class='class-label' style='display:none;'> 
 
    <input type="checkbox" class='class-cb' id="audi" value="audi" style='display:none;'>audi 
 
</label> 
 

 
</div>

Answer 2

function showCheckBox($this) { 
 
\t var cols = document.getElementsByClassName('class-label'); 
 
    for(i=0; i<cols.length; i++) { 
 
     cols[i].style.display = 'none'; 
 
    } 
 
    var cols = document.getElementsByClassName('class-cb'); 
 
    for(i=0; i<cols.length; i++) { 
 
     cols[i].style.display = 'none'; 
 
    } 
 
\t var array = document.getElementsByTagName("input"); 
 
    for(var ii = 0; ii < array.length; ii++) 
 
    { 
 
    if(array[ii].type == "checkbox") 
 
    { 
 
     if(array[ii].value == $this.value) 
 
     { 
 
      array[ii].style.display = 'block'; 
 
      document.getElementById("volvo").checked = false; 
 
      array[ii].parentElement.style.display = 'block'; 
 
     } 
 
    } 
 
    } 
 
}

<select id='id-select' onchange="showCheckBox(this);"> 
 
    <option value="">Select</option> 
 
    <option value="volvo">Volvo</option> 
 
    <option value="saab">Saab</option> 
 
    <option value="opel">Opel</option> 
 
    <option value="audi">Audi</option> 
 
</select> 
 
<div> 
 

 
<label for="volvo" class='class-label' style='display:none;'> 
 
    <input type="checkbox" class='class-cb' id="volvo" value="volvo" style='display:none;'>volvo 
 
</label> 
 

 
<label for="saab" class='class-label' style='display:none;'> 
 
    <input type="checkbox" class='class-cb' id="saab" value="saab" style='display:none;'> saab 
 
</label> 
 
    
 
<label for="opel" class='class-label' style='display:none;'> 
 
    <input type="checkbox" class='class-cb' id="opel" value="opel" style='display:none;'>opel 
 
</label> 
 
    
 
<label for="audi" class='class-label' style='display:none;'> 
 
    <input type="checkbox" class='class-cb' id="audi" value="audi" style='display:none;'>audi 
 
</label> 
 

 
</div>