1、使用:

<link rel="stylesheet" href="css/skins/all.css">或者<link rel="stylesheet" href="css/skins/flat/需要的颜色文件">

<script src="js/jquery.js"></script>

<script src="js/icheck.js"></script>

2、初始化:

$('input').iCheck({
  checkboxClass: 'icheckbox_flat-blue', //每个风格都对应一个,这个不能写错哈。
  radioClass: 'icheckbox_flat-blue',
});

3、选中不选中处理:

$('input').on('ifChecked', function(event){ })

$('input').on('ifUnchecked', function(event){ })

4、主动选中与不选中

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

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

5、获取选中的input:

1)
$('input').on('ifChecked', function(event){   
    $(event.target)
});
event对象:
 
2)$(".icheckbox_flat-blue.checked").find("input")

6、获取当前选中的input的索引:

例子:

<div class="row margin">

  <div class="item2">
    <input type="checkbox" name="ytName1" value="1"/><label class="margin">星期一</label>
  </div>
  <div class="item2">
    <input type="checkbox" name="ytName1" value="2"/><label class="margin">星期二</label>
  </div>
  <div class="item2">
    <input type="checkbox" name="ytName1" value="3"/><label class="margin">星期三</label>
  </div>
</div>

$('input').on('ifChecked', function(event){

    $(event.target).parents(".item2").index()

});

7、获取当前选中的input的val值:(基于4,5)
$('input').on('ifChecked', function(event){  
    $(event.target).val()
});

其他参考API:http://www.bootcss.com/p/icheck/#skins

icheck使用的更多相关文章

  1. iCheck.js

    一.iCheck:http://www.bootcss.com/p/icheck/ 1.选择一个颜色主题,网上有,有了一个肤色主题,然后就是把这个肤色主题的css文件复制到iCheck文件夹里面 2. ...

  2. BootStrapt iCheck表单美化插件使用方法详解(含参数、事件等) 全选 反选

    特色: 1.在不同浏览器(包括ie6+)和设备上都有相同的表现 — 包括 桌面和移动设备 2.支持触摸设备 — iOS.Android.BlackBerry.Windows Phone等系统 4.方便 ...

  3. iCheck表单美化插件使用方法详解(含参数、事件等)

    iCheck   特色: 1.在不同浏览器(包括ie6+)和设备上都有相同的表现 - 包括 桌面和移动设备 2.支持触摸设备 - iOS.Android.BlackBerry.Windows Phon ...

  4. JQery icheck 插件

    <script type="text/javascript"> $(document).ready(function(){ var callbacks_list = $ ...

  5. 优化checkbox和radio,类似Bootstrap中的iCheck

    checkbox和radio浏览器默认的已经满足不了大众的审美需求,更不用说浏览器之间的差异化,取而代之,优化checkbox和radio的方法也随之诞生了. html结构:单选框为例,简单说明: 其 ...

  6. icheck.min.js 选中效果

    遍历所有 checkbox 如果是选中的用 绿色 如果未选中用 灰色 //check控件属性 $('input').each(function() { var self = $(this); var ...

  7. icheck样式绑定与翻页保持

    官方文档:http://icheck.fronteed.com/ 使用基本样式 $('input').iCheck({ checkboxClass : 'icheckbox_square-blue', ...

  8. icheck如何修改样式大小

    icheck默认样式比较大,有需求调整checkbox大小. 1. 最简单的方法可用css3来实现,让整个模块层缩放,不兼容低版本浏览器. transform:scale(0.7,0.7)   2. ...

  9. jquery-插件iCheck 使用

    这是一个兼容多种浏览器的插件 官网:http://icheck.fronteed.com/ 官方给出了很多的例子,我说一个使用的问题. 使用的时候,要放到window..load的外部. 页面html ...

  10. 期货大赛项目|六,iCheck漂亮的复选框

    废话不多说,直接上图 对,还是上篇文章的图,这次我们不研究datatables,而是看这个复选框,比平常的复选框漂亮太多 看看我是如何实现的吧 插件叫iCheck 用法也简单 引入js和css $(& ...

随机推荐

  1. hdu_hpu第八次周赛_1001 To and Fro 201310270918

    To and Fro Time Limit : 2000/1000ms (Java/Other)   Memory Limit : 65536/32768K (Java/Other) Total Su ...

  2. 1414 冰雕 51nod 暴力

    1414 冰雕 题目来源: CodeForces 基准时间限制:1 秒 空间限制:131072 KB 分值: 20 难度:3级算法题  收藏  关注 白兰大学正在准备庆祝成立256周年.特别任命副校长 ...

  3. Spring MVC-集成(Integration)-生成RSS源示例(转载实践)

    以下内容翻译自:https://www.tutorialspoint.com/springmvc/springmvc_rss_feed.htm 说明:示例基于Spring MVC 4.1.6. 以下示 ...

  4. 从Eclipse到Android Studio:Android项目怎样进行迁移

    一開始我们学习Android开发.基本上都是从Eclipse上開始的,随着Google推出Android Studio,这一情况慢慢有了改变.未来非常长一段时间将会呈现Eclipse和AS相互存在的情 ...

  5. AspNet MVC4 教学-27:Asp.Net MVC4 自己定义helper及function的高速Demo

    A.创建Basic类型项目. B.创建App_Code目录,在里面创建2个cshtml文件: MyHelper.cshtml: @helper MyTruncate(string input, int ...

  6. swift 雨燕 新手教程

    Apple Swift编程语言新手教程 chox 2014-06-03 文件夹 简单介绍 入门 简单值 控制流 函数与闭包 对象与类 枚举与结构 1   简单介绍 今天凌晨Apple刚刚公布了Swif ...

  7. Thrift源代码分析(八)--总结加一个完整的可执行的Thrift样例

    前面七篇文章分析了Thrfit的方方面面,看到这里时应该对Thrift有了深入的理解. Thrift源代码分析(一)-- 基本概念 Thrift源代码分析(二)-- 协议和编解码 Thrift源代码分 ...

  8. 关于strace的一点东西

    好久没写博客了,感觉有点羞愧,认为自己也应该静下心来利用自己可分配的时间去提升自己.        尽管近期在看一些Python的东西,但是认为自己还是不能忘记本行啊,Linux C的一些东西必须一直 ...

  9. HDU 3397 Sequence operation 多标记线段树

    /* 一开始维护了两个标记 开了两个数组 想的是 可能当前两种操作都要做 但是太复杂了 不好处理 其实 当前要做的标记可以只有一个 我们在Insert的时候 要打的标记是2即翻转区间: 1.如果原来是 ...

  10. framebuffer的入门介绍-实现程序分析【转】

    本文转载自:http://blog.csdn.net/liuzijiang1123/article/details/46972723 如想想对lcd屏进行操作(例如在lcd屏幕上画线,或者显示视频数据 ...