方便实用的jQuery checkbox复选框全选功能
// 主复选框
<input type="checkbox" id="ck" name="ckAll">
// 子复选框项
<input type="checkbox" id="ck1" name="ckItm">
<input type="checkbox" id="ck2" name="ckItm">
<input type="checkbox" id="ck3" name="ckItm">
var $ckAll = $("input[name='ckAll']");
var $ckItm = $("input[name='ckItm']");
var len = $ckItm.length;
$ckAll.click(function() {
// 获取$ckAll当前选中状态,如果选中,其他子复选框则选中,反之则取消
$ckItm.prop('checked',this.checked);
});
$ckItm.click(function() {
// 给b绑定判断事件
var b=$ckItm.filter(":checked").length==len;// 当所选的子复选框个数等于总个数,主复选框则会被选中
// 通过三元运算判断
var flag=$ckAll.prop("checked",b?true:false);
});
方便实用的jQuery checkbox复选框全选功能的更多相关文章
- Jquery表格变色 复选框全选,反选
/*jquery静态表格变色*/ $(".tr2").mouseover(function(){ $(this).css("background"," ...
- jQuery 复选框全选/取消全选/反选
jQuery实现的复选框全选/取消全选/反选及获得选择的值. 完整代码: <!DOCTYPE html> <html> <head> <script type ...
- jQuery 前端复选框 全选 反选 下拉菜单联动
jQuery 页面中复选框全选.反选.下拉联动(级联) <!DOCTYPE html> <html lang="en"> <head> < ...
- jQuery中的几个案例:隔行变色、复选框全选和全不选
1 表格隔行变色 1 技术分析: 1 )基本过滤选择器: odd: even: 2 )jq添加和移除样式: addClass(); removeClass(); 2 代码实现 <script s ...
- checkbox复选框全选批量删除
多选框全选实现批量删除 html代码 <body> <form action="" method="post" name="Form ...
- jQuery实现复选框 全选、反选、全不选
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <hea ...
- jQuery 实现复选框全选、反选及获取选中的值
实现复选框全选,反选及获取选中的值: 代码如下: <!doctype html> <html lang="en"> <head> <met ...
- js 复选框 全选都选 如果某一个子复选框没选中 则全选按钮不选中
<!DOCTYPE HTML> <html> <head> <meta charset=UTF-8> <title>js 复选框 全选都选 ...
- JavaScript小例子:复选框全选
JavaScript小例子:复选框全选 这只是一个小例子,很简单,但是这个功能还是很常用的: 实现后效果如图: JavaScript代码: <script type="text/jav ...
- 复选框全选、全不选和反选的效果实现VIEW:1592
<html> <head> <meta http-equiv="Content-Type" content="text/html; char ...
随机推荐
- Java最重要的21个技术点和知识点之JAVA基础
(一)Java最重要的21个技术点和知识点之JAVA基础 写这篇文章的目的是想总结一下自己这么多年JAVA培训的一些心得体会,主要是和一些java基础知识点相关的,所以也希望能分享给刚刚入门的Ja ...
- Java学习笔记——显示当前日期的三种方式
一.Date类:这是一种过时的表达方式 import java.util.Date; Date date = new Date(); System.out.println((1900+date.get ...
- XMLObject 简易xml格式接口数据生成和解析工具
简单的请求封装,相当于封装了Book对象,但比Book对象参数更灵活 XMLObject xml = new XMLObject("book");xml.add("aut ...
- Qt绘图控件qwt绘制等比例坐标图
需要用到QwtPlotRescaler类,用法如下: QwtPlotRescaler *plotRescaler = new QwtPlotRescaler(canvas, yLeft, QwtPlo ...
- 转移指令jmp和跳转指令call
[-1]写在前面 以下内容文字描述来自于 王爽老师的<汇编语言>教材,建议大家都买一本,哈哈.不是我打广告,确实人家写的好,应该支持.我只是附上了自己的图片和理解而已. [0]先上干货 只 ...
- MyEclipse设置编码方式 转载【http://www.cnblogs.com/susuyu/archive/2012/06/27/2566062.html】
1.windows->Preferences……打开"首选项"对话框,左侧导航树,导航到general->Workspace, 右侧Text file encoding ...
- MYSQL关于表的一些操作
mysqldump -u username -p dbname > dbname.sql 清空表数据 delete from xxxx; 插入一条数据 insert into tablename ...
- 剑指Offer19 包含min函数的栈
/************************************************************************* > File Name: 19_MinInS ...
- 微软测试版Visual Studio for Mac下载
地址:https://www.visualstudio.com/thank-downloading-visual-studio-mac/?sku=vsmac#
- Java作业 输入圆的半径计算输出圆的周长和面积
package text1; import java.util.Scanner; public class text11 { public static void main(String[] args ...