为什么不在Bootstrap-select上禁用属性工作?

时间:2013-11-17 12:36:07

标签: jquery twitter-bootstrap icheck bootstrap-select

我想设计我的网站表单,输入和选择。我使用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属性在bootstrap select上不起作用?
任何帮助表示赞赏!谢谢!

2 个答案:

答案 0 :(得分:4)

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

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

FIDDLE

答案 1 :(得分: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代码