地址:http://www.bootcss.com/p/icheck/#skins

使用

1. 先引入文件

css <link rel="stylesheet" type="text/css" href="../css/web2.0/skins/all.css">

js <script type="text/javascript" src="../js/web2.0/jquery.icheck.js"></script>

  选择你要使用的皮肤样式主题,共6个(css文件不同)

2.html 结构

<ul class="icheck">
  <li>
<input tabindex="01" type="checkbox" name="" />
  </li>
</ul>

3. js 调用

$('.icheck input').on('ifCreated ifClicked ifChanged ifChecked ifUnchecked ifDisabled ifEnabled ifDestroyed', function(event){
}).iCheck({
checkboxClass: 'icheckbox_square-green' //class类名,控制选框样式
});

总结:

 插件方法:

  $('input').iCheck('check'); — 将输入框的状态设置为checked

  $('input').iCheck('uncheck'); — 移除 checked 状态

  $('input').iCheck('toggle'); — toggle checked state

  $('input').iCheck('disable'); — 将输入框的状态设置为 disabled--不可点击

  $('input').iCheck('enable'); — 移除 disabled 状态

  $('input').iCheck('update'); — apply input changes, which were done outside the plugin

  $('input').iCheck('destroy'); — 移除iCheck样式

回调事件

  

使用案例:

var _allckbox = $(".all-ckbox").find(".icheck input")
_sonckbox = $(".allck-con").find(".icheck input")
// 如果全选 选中 那么所有子集都选中
_allckbox.on('ifChecked ifUnchecked', function(event) {
if (event.type == 'ifChecked') { //判断是否选中
_sonckbox.iCheck('check');
} else {
_sonckbox.iCheck('uncheck');
}
});
// 如果子集全都选中,那么全选 也选中状态
_sonckbox.on('ifChecked ifUnchecked', function(event) {
var _sonckboxize = _sonckbox.size();
var _sonckboxsize_ck = _sonckbox.filter(":checked").size();
if (event.type == 'ifChecked') {
if(_sonckboxsize_ck == _sonckboxize){
_allckbox.prop('checked', 'checked');
}
} else {
_allckbox.removeProp('checked');
}
_allckbox.iCheck('update');
});

ickeck插件的更多相关文章

  1. Angular杂谈系列1-如何在Angular2中使用jQuery及其插件

    jQuery,让我们对dom的操作更加便捷.由于其易用性和可扩展性,jQuer也迅速风靡全球,各种插件也是目不暇接. 我相信很多人并不能直接远离jQuery去做前端,因为它太好用了,我们以前做的东西大 ...

  2. Jenkins 安装的HTML Publisher Plugin 插件无法展示ant生成的JunitReport报告

    最近在做基于jenkins ant  junit 的测试持续集成,单独ant junit生成的junitreport报告打开正常,使用Jenkins的HTML Publisher Plugin 插件无 ...

  3. 常用 Gulp 插件汇总 —— 基于 Gulp 的前端集成解决方案(三)

    前两篇文章讨论了 Gulp 的安装部署及基本概念,借助于 Gulp 强大的 插件生态 可以完成很多常见的和不常见的任务.本文主要汇总常用的 Gulp 插件及其基本使用,需要读者对 Gulp 有一个基本 ...

  4. solr服务中集成IKAnalyzer中文分词器、集成dataimportHandler插件

    昨天已经在Tomcat容器中成功的部署了solr全文检索引擎系统的服务:今天来分享一下solr服务在海量数据的网站中是如何实现数据的检索. 在solr服务中集成IKAnalyzer中文分词器的步骤: ...

  5. 使用Visual Studio SDK制作GLSL词法着色插件

    使用Visual Studio SDK制作GLSL词法着色插件 我们在Visual Studio上开发OpenGL ES项目时,避免不了写Shader.这时在vs里直接编辑shader就会显得很方便. ...

  6. 工欲善其事,必先利其器 之 VS2013全攻略(安装,技巧,快捷键,插件)!

    如有需要WPF工具的朋友可以移步 工欲善其事,必先利其器 之 WPF篇: 随着开发轨迹来看高效WPF开发的工具和技巧 之前一篇<c++的性能, c#的产能?!鱼和熊掌可以兼得,.NET NATI ...

  7. Jquery mobiscroll 移动设备(手机)wap日期时间选择插件以及滑动、滚动插件

    Jquery Mobiscroll是一个用于触摸设备(Android phones, iPhone, iPad, Galaxy Tab)的日期和时间选择器jQuery插件.以及各种滑动插件 可以让用户 ...

  8. 10个最好用的HTML/CSS 工具、插件和资料库

    大家在使用HTML/CSS开发项目的过程中,有使用过哪些工具,插件和库?下面介绍的10种HTML/CSS工具,插件和资料库,是国外程序员经常用到的. Firebug Lite FirebugLite ...

  9. 在Sublime Text 3上安装代码格式化插件CodeFormatter

    1.了解CodeFormatter插件 在Sublime Text 3中编写代码,为了能让我们的代码格式变得漂亮整洁,需要一个能自动格式代码的插件.这里发现CodeFormatter插件不错,它能支持 ...

随机推荐

  1. mybatis原理源码大牛连接

    mybatis讲解的非常好的连接: https://www.jianshu.com/nb/5226994 执行流程简介参考:http://www.cnblogs.com/dongying/p/4142 ...

  2. 在 NetBeans 中开发一般 Java 应用程序时配置 Allatori 进行代码混淆

    要在 NetBeans 中开发一般 Java 应用程序时利用 Allatori 进行代码混淆,设置比 IntelliJ IDEA 稍微简单一点,首先在 NetBeans 项目所在硬盘目录内创建一个名为 ...

  3. Oracle For 循环添加数据

    自己亲自使用的,绝对OK --添加数据declare i number; --用for实现 begin for i in 0 .. 500 loop insert into cust(custsn,t ...

  4. ListView+EditText使用遇到的坑

    最近项目中某功能需要ListView嵌套EditText来实现,使用过程中遇到一些问题: 1.点击弹出编辑框,edittext会失去焦点. 解决焦点丢失的问题 解决思路:软键盘弹出的时候会重新绘制界面 ...

  5. Codeforces Round #442 (Div. 2) Danil and a Part-time Job

    http://codeforces.com/contest/877/problem/E 真的菜的不行,自己敲一个模板,到处都是问题.哎 #include <bits/stdc++.h> u ...

  6. 关于udo3d双目相机的嵌入式板子系统重装

    遇到的问题: 1.下载压缩文件(.rar):在linux下下载一会就会停止 原因:linux下不支持.rar文件的下载,在windows下载即可 2.在windows下解压文件,结果为镜像文件(.im ...

  7. see

    Description 问从点(0,0)能看到点(0,0)和(n,n)之间的矩形的多少个整数点,看到(x,y)代表点(0,0)和点(x,y)间没有其他整数点,如看不到(2,4)因为中间有点(1,2) ...

  8. app 检查更新和更新

    第一种,手动检查 ////  Harpy.h//  Harpy////  Created by Arthur Ariel Sabintsev on 11/14/12.//  Copyright (c) ...

  9. GOF23种设计模式-工厂模式

    • 工厂模式: – 实现了创建者和调用者的分离. – 详细分类: • 简单工厂模式 • 工厂方法模式 • 抽象工厂模式 • 面向对象设计的基本原则: – OCP(开闭原则,Open-Closed Pr ...

  10. 百科知识 .e,.ec文件如何打开

    1 .e是易语言源文件,你可以从以下网址下载e语言编程环境: http://www.xiazaiba.com/html/409.html   2 安装之后会自动关联.e文件.   3 打开一个e语言文 ...