bootstrap 中的 iCheck 全选反选功能的实现
喜欢bootstrap 风格的同学应该知道,iCheck的样式还是很好看的。
官网: http://www.bootcss.com/p/icheck/
进入正题,iCheck提供了一些方法,可以进行全选和反选的判定。
ifChecked:输入框的状态变为 checked
ifUnchecked:checked 状态被移除
ifChanged:输入框的 checked 或 disabled 状态改变了
var checkAll =$('input.all'); //全选的input
var checkboxs =$('input.check'); //所有单选的input checkAll.on('ifChecked ifUnchecked',function(event){
if(event.type == 'ifChecked'){
checkboxs.iCheck('check');
}else{
checkboxs.iCheck('uncheck');
}
}); checkboxs.on('ifChanged',function(event){
if(checkboxs.filter(':checked').length == checkboxs.length){
checkAll.prop('checked',true);
}else{
checkAll.prop('checked',false);
}
checkAll.iCheck('update');
})
PS:其实本人是很讨厌bootstrap的,奈何公司。。。;
之前不知道怎么写,看了各个网站,发现他们判断状态改变是这样写的
removeProp()这个方法我认为不太好,会出现无法移除的bug,说到这里就有点生气了,你说你分享你的知识的时候都不测试的吗???昂!
removeProp()用于移除由 prop() 添加的属性,不要使用该方法来移除诸如 style、id 或 checked 之类的 HTML 属性。
可以用removeAttr(),或者 prop('checked',false)替代;
*removeAttr() 这个好像也是有点问题的,自行试试。
bootstrap 中的 iCheck 全选反选功能的实现的更多相关文章
- C# WinForm中实现CheckBox全选反选功能
今天一群里有人问到这个功能,其实应该挺简单,但提问题的人问题的出发点并没有描述清楚.因此,一个简简单单的需求,就引起了群内热烈的讨论.下面看看这个功能如何去实现,先上效果: 下面直接上代码,请不要在意 ...
- jquery 书写全选反选功能
书写一个后台管理中用到的全选反选功能.代码如下 <!DOCTYPE html> <html lang="en"> <head> <meta ...
- JavaScript 实现全选 / 反选功能
JavaScript 实现全选 / 反选功能 版权声明:未经授权,内容严禁转载! 构建主体界面 编写 HTML 代码 和 CSS 代码,设计主题界面 <style> #user { wid ...
- 关于Winform下DataGridView中实现checkbox全选反选、同步列表项的处理
近期接手一个winform 项目,虽然之前有.net 的经验,但是对一些控件的用法还不是很熟悉. 这段时间将会记录一些在工作中遇到的坎坷以及对应的解决办法,写出来与大家分享并希望大神提出更好解决方法来 ...
- JS全选反选功能
总选框:<input type="checkbox" class="all" name="all"> 子选框: <inpu ...
- jquery实现全选/反选功能
<!DOCTYPE html><html><head> <meta http-equiv="Content-Type" content=& ...
- JQuery实现列表中复选框全选反选功能封装
我们在做列表的时候经常会遇到全选,反选进行批量处理问题,例如: 我当时就是简单的实现了,然后想封装到公共的js中,封装的太烂,不好意思贴出来了(就是把实现代码之间放到公共js中,然后每个页面都用固定的 ...
- jQuery实现全选反选功能
废话不说,直接上代码! <html> <head> <meta http-equiv="Content-Type" content="tex ...
- web中的简单全选反选
<html> <body> <table> <tr> <th><input type="checkbox" onc ...
随机推荐
- windows安装tesseract-OCR及使用
tesseract是Python的一个OCR(光学字符识别)库 首先下载tesseract的exe安装文件 https://github.com/UB-Mannheim/tesseract/wik ...
- main:处理命令行选项
有时我们需要给main函数传递实参, 我们可以把命令行选项通过两个形参传递给main函数: int mian(int argc, char *argv[]) { ... }; argv是argumen ...
- 2018焦作网络赛 - Poor God Water 一道水题的教训
本题算是签到题,但由于赛中花费了过多的时间去滴吧格,造成了不必要的浪费以及智商掉线,所以有必要记录一下坑点 题意:方格从1到n,每一格mjl可以选择吃鱼/巧克力/鸡腿,求走到n格时满足 1.每三格不可 ...
- 2019.04.11 第四次训练 【 2017 United Kingdom and Ireland Programming Contest】
题目链接: https://codeforces.com/gym/101606 A: ✅ B: C: ✅ D: ✅ https://blog.csdn.net/Cassie_zkq/article/ ...
- redis持久化之 aof日志
aof就是把执行的命令写到文本文件里面 aof使用过程 第一步: 修改配置文件,并启动server 第二步, 当前目录下面会生成一个 appendonly.aof文件,但是是空的 去客户端 开始操作后 ...
- 事务实现,redo,undo,锁
事务(Transaction)是数据库区别于文件系统的重要特性之一.在文件系统中,如果你正在写文件,但是操作系统突然崩溃了,这个文件就很有可能被破坏.当然,有一些机制可以把文件恢复到某个时间点.不过, ...
- *2_3_5_加入reference model
摘自:http://book.2cto.com/201408/46009.html 在2.1节中讲述验证平台的框图时曾经说过,reference model用于完成和DUT相同的功能. referen ...
- 开发一个 Windows 级别的操作系统难度有多大?
在搜索进程相关问题的时候,无意间看到了知乎上面的这个问题,这也是困惑我的问题,只是自己比较懒,没有刨根问底,这次无意间看到了,并且认真看了大神的回答,很受启发,作为记录,贴于此,与各位分享: 来源:知 ...
- WCF 之部署(2010版本之上)
首先,在WIN系统下打开IIS,每种操作系统是不同的,请不要弄混. 1.控制面板---左下放的程序---启用或关闭Windows功能,如图: 2.找到Internet Information Serv ...
- MINI3内存分配算法
最差适应算法 #ifdef USING_WORST_FIT { //先找到第一个满足要求的空洞, //再以第一个为标准寻找最适合的空洞. //当最适合的空洞完全吻合 //就直接划给它,当空洞较大时就切 ...