ickeck插件
地址: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插件的更多相关文章
- Angular杂谈系列1-如何在Angular2中使用jQuery及其插件
jQuery,让我们对dom的操作更加便捷.由于其易用性和可扩展性,jQuer也迅速风靡全球,各种插件也是目不暇接. 我相信很多人并不能直接远离jQuery去做前端,因为它太好用了,我们以前做的东西大 ...
- Jenkins 安装的HTML Publisher Plugin 插件无法展示ant生成的JunitReport报告
最近在做基于jenkins ant junit 的测试持续集成,单独ant junit生成的junitreport报告打开正常,使用Jenkins的HTML Publisher Plugin 插件无 ...
- 常用 Gulp 插件汇总 —— 基于 Gulp 的前端集成解决方案(三)
前两篇文章讨论了 Gulp 的安装部署及基本概念,借助于 Gulp 强大的 插件生态 可以完成很多常见的和不常见的任务.本文主要汇总常用的 Gulp 插件及其基本使用,需要读者对 Gulp 有一个基本 ...
- solr服务中集成IKAnalyzer中文分词器、集成dataimportHandler插件
昨天已经在Tomcat容器中成功的部署了solr全文检索引擎系统的服务:今天来分享一下solr服务在海量数据的网站中是如何实现数据的检索. 在solr服务中集成IKAnalyzer中文分词器的步骤: ...
- 使用Visual Studio SDK制作GLSL词法着色插件
使用Visual Studio SDK制作GLSL词法着色插件 我们在Visual Studio上开发OpenGL ES项目时,避免不了写Shader.这时在vs里直接编辑shader就会显得很方便. ...
- 工欲善其事,必先利其器 之 VS2013全攻略(安装,技巧,快捷键,插件)!
如有需要WPF工具的朋友可以移步 工欲善其事,必先利其器 之 WPF篇: 随着开发轨迹来看高效WPF开发的工具和技巧 之前一篇<c++的性能, c#的产能?!鱼和熊掌可以兼得,.NET NATI ...
- Jquery mobiscroll 移动设备(手机)wap日期时间选择插件以及滑动、滚动插件
Jquery Mobiscroll是一个用于触摸设备(Android phones, iPhone, iPad, Galaxy Tab)的日期和时间选择器jQuery插件.以及各种滑动插件 可以让用户 ...
- 10个最好用的HTML/CSS 工具、插件和资料库
大家在使用HTML/CSS开发项目的过程中,有使用过哪些工具,插件和库?下面介绍的10种HTML/CSS工具,插件和资料库,是国外程序员经常用到的. Firebug Lite FirebugLite ...
- 在Sublime Text 3上安装代码格式化插件CodeFormatter
1.了解CodeFormatter插件 在Sublime Text 3中编写代码,为了能让我们的代码格式变得漂亮整洁,需要一个能自动格式代码的插件.这里发现CodeFormatter插件不错,它能支持 ...
随机推荐
- 【CF696B】Puzzles(树形DP,期望)
题意:n 个节点的树,初始位置为 1 号节点,初始时间为 1.每次随机地走向任何一个没有走过的子树并且令时间 +1求问走到每一个点时的时间的期望值 思路:比较少见的一道自顶向下的树形DP dp[i]表 ...
- Sum BZOJ 3944
Sum [问题描述] 给定一个正整数 N ( N <= 231 - 1 ) 求: [输入格式] 一共T+1行 第1行为数据组数T(T<=10) 第2~T+1行每行一个非负整数N,代表一组询 ...
- Why do I keep getting mixed tabs and spaces in a Visual Studio C# code window?[vs power tools issue transfered]
goto tools->option->power tools-> turn "use mixed tabs" option to off. you won`t ...
- 标准C程序设计七---45
Linux应用 编程深入 语言编程 标准C程序设计七---经典C11程序设计 以下内容为阅读: <标准C程序设计>(第7版) 作者 ...
- 打印倒序NxN乘法表
一.实验要求: 给定任意一个字符N(N>0),然后打印NxN的倒序乘法表. 二.解决问题: #/!bin/bash# #define functionNxN_fun(){ local i=$1 ...
- 【leetcode】Find All Anagrams in a String
[leetcode]438. Find All Anagrams in a String Given a string s and a non-empty string p, find all the ...
- 精读《Function Component 入门》
1. 引言 如果你在使用 React 16,可以尝试 Function Component 风格,享受更大的灵活性.但在尝试之前,最好先阅读本文,对 Function Component 的思维模式有 ...
- const T、const T*、T *const、const T&、const T*& 的区别
原文地址: http://blog.csdn.net/luoweifu/article/details/45600415 这里的T指的是一种数据类型,可以是int.long.doule等基本数据类型, ...
- 邁向IT專家成功之路的三十則鐵律 鐵律二十六:IT人閱讀之道-慎選
IT人經常一整天工作回來早已用腦過度,此時收看什麼樣的電視節目,以及閱讀甚麼樣的書籍.聽什麼樣的音樂與有聲書最適合我們,讓我們可以在放鬆之餘,還能夠讓自己內在的心靈與外在的能力繼續成長呢? 身為IT工 ...
- Flash中如何使用滤镜
使用滤镜 应用或删除滤镜 复制和粘贴滤镜 为对象应用预设滤镜 启用或禁用应用于对象的滤镜 启用或禁用应用于对象的所有滤镜 创建预设滤镜库 对象每添加一个新的滤镜,在属性检查器中,就会将其添加到该对象所 ...