1

我想为我的网站表单、输入和选择设置样式。我将Bootstrap用于输入,将Bootstrap-select用于选择,将 iCheck用于复选框。问题是 iCheck 不能与 Bootstrap-select 一起正常工作。

这是 jsFiddle 测试:http: //jsfiddle.net/36Xpf/

现在,尝试检查 iCheck 复选框,bootstrap-select 的选择不会被禁用。然后选中标准方形复选框,引导程序的选择将被禁用。

如果使用 jQuery 选中复选框,我会禁用该属性以选择.change()

$('#checkbox1').change(function(){
  if (this.checked) {
    $('.selectpicker').attr('disabled', false);
  } else {
    $('.selectpicker').attr('disabled', true);
  }                   
});

我做错了什么?为什么 disabled 属性在引导选择上不起作用?
任何帮助表示赞赏!谢谢!

4

2 回答 2

5

它是一个插件,而不是常规复选框,您必须监听它实际支持的事件:

$('#checkbox1').on('ifChanged', function(){
    $('.selectpicker').attr('disabled', this.checked).selectpicker('refresh');
}).iCheck({
    checkboxClass: 'icheckbox_flat-red',
    radioClass: 'iradio_flat-red' 
});

小提琴

于 2013-11-17T12:43:19.380 回答
1
    $('input#checkbox1').iCheck({
    checkboxClass: 'icheckbox_flat-red',
    radioClass: 'iradio_flat-red' 
});
$('.selectpicker').selectpicker();


$(document).on('ifChecked','#checkbox1',function(){
      $('.selectpicker').prop('disabled',true);
     $('.selectpicker').selectpicker('refresh');
});
$(document).on('ifUnchecked','#checkbox1',function(){
     $('.selectpicker').prop('disabled',false);
     $('.selectpicker').selectpicker('refresh');
});


/*standard checkbox*/
$('#checkbox2').change(function(){
  if (this.checked) {
    $('.standard').attr('disabled', true);
  } else {
    $('.standard').attr('disabled', false);
  }                   
});

使用这个js代码

于 2013-11-17T12:56:36.570 回答