jQuery 实现复选框的全选与反选
<script>
//实现全选与反选
$(".allAndNotAll").click(function () {
if ($(this).prop("checked")) {
$("input[id=inlineCheckbox1]:checkbox").each(function () {
$(this).prop("checked", true);
});
} else {
$("input[id=inlineCheckbox1]:checkbox").each(function () {
$(this).prop("checked", false);
});
}
});
//当其中不勾选某一个选项的时候,则去掉全选复选框
$(":checkbox[id=inlineCheckbox1]").click(function () {
$(".allAndNotAll").prop('checked',
$(":checkbox[id=inlineCheckbox1]").length == $(":checkbox[id=inlineCheckbox1]:checked").length);
});
</script>
<!-- 全选按钮 -->
<label for="exampleInputEmail2">全选</label>
<input type="checkbox" class="allAndNotAll">
<!-- 单选框 -->
<td><input type="checkbox" value="{{ data.id }}" name="product_bound_id" id="inlineCheckbox1"></td>
jQuery 实现复选框的全选与反选的更多相关文章
- 【jQuery】复选框的全选、反选,推断哪些复选框被选中
本文与<[JavaScript]复选框的全选.反选.推断哪些复选框被选中>(点击打开链接)为姊妹篇,把里面内容再与jQuery框架中实现一次,相同做到例如以下的效果: 布局还是相同的布局, ...
- 一天搞定jQuery(三)——使用jQuery完成复选框的全选和全不选
还记得之前我使用JavaScript来实现复选框的全选和全不选效果吗?如果读者初次翻阅本文,可记得看看教你一天玩转JavaScript(七)——使用JavaScript完成复选框的全选和全不选的效果! ...
- jQuery学习(五)——使用JQ完成复选框的全选和全不选
1.在系统后台进行人员管理时,进行批量删除,使用jq完成全选和全不选 步骤分析: 第一步:引入jquery文件 第二步:书写页面加载函数 第三步:为上面的复选框绑定单击事件 第四步:将下面所有的复选框 ...
- jQuery实现复选框的全选、反选、并且根据复选框的<checked属性>控制多个对应div的显示/隐藏
<!doctype html><html> <head> <meta charset="utf-8"> <title>j ...
- JQ实现复选框的全选反选不选
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- Vue复选框的全选
<!DOCTYPE html><html> <head> <meta charset="utf-8"> ...
- jQuery_完成复选框的全选与全不选
别的不多说,直接上代码,用于完成复选框的全选与全不选. <!DOCTYPE html> <html> <head> <meta charset="U ...
- js实现复选框的全选、全不选、反选
js中实现复选框的全选,全不选以及反选,分为两种情况: (1)选中“请选择”前面的复选框实现全选,不选中“请选择”前面的复选框实现全不选 <!DOCTYPE html PUBLIC " ...
- js做全选,用一个checkbox复选框做多个checkbox复选框的全选按钮,有一个复选框未被选择时,全选按钮的checked就为false
用一个checkbox复选框做多个checkbox复选框的全选按钮,有一个复选框未被选择时,全选按钮的checked就为false,当所有checkbox都被选中时,全选按钮也被选中. 详解: 有两种 ...
- js实现复选框的全选、全不选和反选
js实现复选框的全选.全不选和反选 主要是用遍历的方法查找元素,然后通过改变checked的属性来选择,为true则是选中状态,为false则是未选状态 实现代码 <!DOCTYPE html& ...
随机推荐
- ADO.NET 【实体类】【数据访问类】
认识分层结构,分层式结构是最常见,也是最重要的一种结构. 三层架构(3-tier architecture) 界面层(User Interface layer) 主要对用户的请求接受,以及数据的返回, ...
- 设计模式之工厂方法(FactoryMethod)模式
在五大设计原则的基础上经过GOF(四人组)的总结,得出了23种经典设计模式,其中分为三大类:创建型(5种).结构型(7种).行为型(11种).今天对创建型中的工厂方法(FactoryMethod)模式 ...
- [日常] 高性能MySQL-索引
1.mysql的索引工作类似一本书的目录部分,想找某个特定主题,先查找书的目录部分,找到对应的页码2.ORM工具只能生成基本的合法的查询3.索引是在存储引擎层实现的,不是服务器层4.B-tree就是指 ...
- [javaSE] 集合框架(体系概述)
为什么出现集合类 为了方便对多个对象的操作,对对象进行存储,集合就是存储对象最常用的一种方式 数组和集合的不同 数组是固定长度的,集合是可变长度的 数组可以存储基本数据类型,集合只能存储对象 数组只能 ...
- 乐字节-Java8新特性之方法引用
上一篇小乐介绍了<Java8新特性-函数式接口>,大家可以点击回顾.这篇文章将接着介绍Java8新特性之方法引用. Java8 中引入方法引用新特性,用于简化应用对象方法的调用, 方法引用 ...
- 关于chrome 插件PageMonitor 安装及使用步骤
首先是安装: 第一步:打开谷歌浏览器的设置界面(如果没有谷歌浏览器需要下载安装下) 然后 点击左侧扩展程序:出现如下图 然后把附件中Page_Monitor_Chrome.crx文件托到扩展程序界面, ...
- JavaScript--事件绑定及深入(26)
// 事件绑定分为两种: // 一种是传统事件绑定(内联模型/脚本模型);上一章内容; // 一种是现代事件绑定(DOM2级模型);现代事件绑定在传统事件绑定基础上提供了更强大的功能; 一 传统事件绑 ...
- PDO异常处理
PDO提供了三种处理错误的方式 PDO::ERRMODE_SILENT:静默模式(默认) PDO::ERRMODE_WARNING:警告模式 PDO::ERRMODE_EXCEPTION:异常模式 示 ...
- layui 页面加载 阴影 请求页面加载转圈页面
var layerIndex= layer.load(1,{shade: [0.3, '#000']}); $.post('${pageContext.request.contextPath}/lea ...
- 设计模式(15)--Interpreter(解释器模式)--行为型
作者QQ:1095737364 QQ群:123300273 欢迎加入! 1.模式定义: 解释器模式是类的行为模式.给定一个语言之后,解释器模式可以定义出其文法的一种表示,并同时提供一个解 ...