【iCheck基本用法的使用】

iCheck基本用法的使用

一. 常用方法改变iCheck的状态
1. 使拿到的iCheck标签选中
$('#input-1, #input-3').iCheck('check');
2. 使拿到的iCheck标签非选中
$('#input-1, #input-3').iCheck('uncheck');
3. 使拿到ICheck标签不可点击
$('#input-2, #input-4').iCheck('disable');
4. 使拿到ICheck标签可点击
$('#input-2, #input-4').iCheck('enable');
5. 移除iCheck样式
$('input').iCheck('destroy');

           

二. 常用回调事件,监听iCheck的change事件.
事件名称 使用时机
ifClicked  用户点击了自定义的输入框或与其相关联的label
ifChanged  输入框的 checked 或 disabled 状态改变了
ifChecked  输入框的状态变为 checked
ifUnchecked  checked 状态被移除
ifDisabled  输入框状态变为 disabled
ifEnabled  disabled 状态被移除
ifCreated  输入框被应用了iCheck样式
ifDestroyed  iCheck样式被移除
例. iCheck 的选中事件
$('input').on('ifChecked', function(event){
  alert(event.type + ' callback');
});
例. iCheck 的取消选中事件 
$(document).on("ifUnchecked", "input", function(event){
  alert(event.type + ' callback');
}

var checkAll = $('input.all');
var checkboxes = $('input.check');

checkAll.on('ifChecked ifUnchecked', function(event) {
  if (event.type == 'ifChecked') {
     checkboxes.iCheck('check');
  } else {
     checkboxes.iCheck('uncheck');
  }
});

checkboxes.on('ifChanged', function(event){
  if(checkboxes.filter(':checked').length == checkboxes.length) {
      checkAll.prop('checked', 'checked');
  } else {
      checkAll.prop('checked',false);
  }
  checkAll.iCheck('update');
});

           

表单页可以选择，改为无法选择

class="i-checks "

$(".i-checks").remove();
$(".i-checks").iCheck('uncheck');