选中主复选框时如何使复选框可见？

Question

good morning guys, I have 3 checkboxes created in php. one that i want to use as a controller

<p>
    <?php  $creates = array('name'=> 'single_obs_value','class' => 'singleobsyes','value'=> '1','style'=>' float: left; margin-right: 2px;'); ?>
    <?=form_label('Single Observation : ');?>
    <?=form_checkbox($creates);?>
    <br>
</p>

And the other two are brought in from a database array variable.

<p>
    <?php   foreach($obsnames as $cp){  ?>
        <?php  $create = array('name'=> 'cms_permissions[]','class' => 'singleobs','value'=> $cp->id,'style'=>' float: left; margin-right: 10px;'); ?>
        <span style="width:200px; float:left">
            <?=form_checkbox($create ).' '.form_label($cp->field_name);?>
        </span>
    <?php }  ?>
</p>

How do i first make the two brought in by the database invisible when the page loads. Then when the controller checkbox is ticked make the two checkboxes visible again. If possible with a jquery function that uses the class of the controller checkbox as such.

$('#singleobsyes').change(function(){

Rather than

$('input[type="checkbox"']

As i use other checkboxes on the page and i believe that may cause some conflict.

Answer 1

try this

$(document).ready(function(){
  $('input[type="checkbox"]').not('.singleobsyes').hide();// hide all checkboxes other than controller

  $('.singleobsyes').change(function(){

    if($(this).is(':checked') 
        $('input[type="checkbox"]').not('.singleobsyes').show();    
    else
       $('input[type="checkbox"]').not('.singleobsyes').hide();
  });

});