显示和隐藏在I检查的复选框，另一个复选框选中和未选中状态

I检查复选框CSS类映射代码

<script> 
$(function() { 
    //Initialize Select2 Elements 
    $(".select2").select2();   
    //Flat red color scheme for iCheck 
    $('input[type="checkbox"].flat-red, input[type="radio"].flat-red').iCheck({ 
     checkboxClass: 'icheckbox_flat-red', 
     radioClass: 'iradio_flat-red' 
    }); 

});

jQuery的显示和隐藏第二个复选框

<script> 
$("#ch_bx_haveparent").iCheck('toggle', function() { 
    $("#ch_bx_haveparent").on('ifChecked', function (event) { 
     alert('ch_bx_status Checkbox Shown'); 
     $("#ch_bx_status").show(); 
    }); 
    $("#ch_bx_haveparent").on('ifUnchecked', function (event) { 
     alert('ch_bx_status Checkbox hidden'); 
     $("#ch_bx_status").hide(); 
    }); 
});

click here for Icheck Checkbox

HTML代码

<div class="modal" id="menuiconmodal" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel"> 
     <div class="modal-dialog"> 
     <div class="modal-content"> 
      <div class="modal-header"> 
      <button type="button" class="close" data-dismiss="modal" aria-label="Close"> 
      <span aria-hidden="true">&times;</span></button> 
      <h4 class="modal-title">Menu</h4> 
      </div> 
      <div class="modal-body"> 

     <div class="form-group"><input type="checkbox" class="flat-red" id="ch_bx_haveparent"/> 
     // Input tag for checkbox that will be shown and hidden 
     <div class="form-group"><input type="checkbox" class="flat-red" runat="server" id="ch_bx_status" /></div> 
     </div> 
      </div> 
      <div class="modal-footer"> 

      <a href="javascript:;" id="sucess" class="btn btn-primary" data-dismiss="modal">Save</a> 
      </div> 
     </div> 
     <!-- /.modal-content --> 
     </div> 
     <!-- /.modal-dialog --> 
    </div> 
    <!-- /.modal -->

警报被填充，但隐藏和显示是行不通的。

来源

2016-03-07 Natavar Ghodasara

$("#ch_bx_haveparent").change(function() { 
 
    if ($("#ch_bx_haveparent").is(':checked')) { 
 
    $("#ch_bx_status").show(); 
 
    } else { 
 
    $("#ch_bx_status").hide(); 
 
    } 
 

 
}).change();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> 
 
<div class="modal" id="menuiconmodal" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel"> 
 
    <div class="modal-dialog"> 
 
    <div class="modal-content"> 
 
     <div class="modal-header"> 
 
     <button type="button" class="close" data-dismiss="modal" aria-label="Close"> 
 
      <span aria-hidden="true">&times;</span> 
 
     </button> 
 
     <h4 class="modal-title">Menu</h4> 
 
     </div> 
 
     <div class="modal-body"> 
 

 
     <div class="form-group"> 
 
      <input type="checkbox" class="flat-red" id="ch_bx_haveparent" />// Input tag for checkbox that will be shown and hidden 
 
      <div class="form-group"> 
 
      <input type="checkbox" class="flat-red" runat="server" id="ch_bx_status" /> 
 
      </div> 
 
     </div> 
 
     </div> 
 
     <div class="modal-footer"> 
 

 
     
 
     </div> 
 
    </div> 
 
    <!-- /.modal-content --> 
 
    </div> 
 
    <!-- /.modal-dialog --> 
 
</div> 
 
<!-- /.modal -->

尝试这种方式

来源

2016-03-07 07:44:11 guradio

$('#ch_bx_haveparent').change(function() { 
    if ($(this).attr("checked")) { 
     $("#ch_bx_status").show(); 
     return; 
    } 
    $("#ch_bx_status").hide(); 
});

来源

2016-03-07 14:02:48

做这样的工作对我来说 –

**找到解决方案使用jQuery的addClass（）和removeClass（）用于I检查复选框隐藏方法和显示**

CSS代码

.call 
    { 
     display:none; 
    }

的jQuery代码

<script> 
$("#ch_bx_haveparent").iCheck('toggle', function() { 
    $("#ch_bx_haveparent").on('ifChecked', function (event) { 
     $("#parentmenu").removeClass("call"); // hide 

    }); 
    $("#ch_bx_haveparent").on('ifUnchecked', function (event) { 
     $("#parentmenu").addClass("call"); // shown 
    }); 
});

**凡DIV ID = “parentmenu” **

来源

2016-03-08 06:06:49

显示和隐藏在I检查的复选框，另一个复选框选中和未选中状态

回答

相关问题