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& ...
随机推荐
- C# 文本转语音,在语音播放过程中停止语音
1,运用SpVoice播放语音 在VS2013创建Windows窗体应用程序项目,添加引用COM组件Microsoft Speech Object Library: using SpeechLib; ...
- windows中80端口被System占用,PID=4的问题
在windows中如果tomcat需要使用80端口,发现该端口已经被占用,而netstat -ano发现该80端口被一个System的进程占用了,而PID=4.我们可以通过下面的方式找到对应的进程,然 ...
- Android-Messenger跨进程通信
http://blog.csdn.net/lmj623565791/article/details/47017485 一.概述 我们可以在客户端发送一个Message给服务端,在服务端的handler ...
- Android使用AOP
这里不讲aop的概念,网上资料很多,这里只讲如何配置aop和自定义plugin. 1.使用场景 在android中,有些业务是公共的,例如:登录判断.获取权限.网络判断等一些公用的业务逻辑,这些都可以 ...
- 【学习笔记】---老男孩学Python,day1
老早同学就推荐自己学编程了,因为各种事耽误了几年的时间,也可以说自己没有居安思危的意识吧… 直到今年2月份决定掏钱学线上课,但是又被兼职打断了,公司忙,兼职事多,拖来拖去只能把课程延期.这一拖就到了五 ...
- Python selenium —— 父子、兄弟、相邻节点定位方式详解
今天跟大家分享下selenium中根据父子.兄弟.相邻节点定位的方法,很多人在实际应用中会遇到想定位的节点无法直接定位,需要通过附近节点来相对定位的问题,但从父节点定位子节点容易,从子节点定位父节点. ...
- htnl类名命规范
html 命名规则 一.注意事项: 1. 一律小写; 2. 尽量用英文; 3. 不加中杠和下划线; 4. 尽量不缩写,除非一看就明白的单词. 主要的 master.css 模块 module.css ...
- autocad视图汇报,像ppt那样汇报
在大部分场景中,工程师可以用cad进行汇报,避免去做PPT,浪费时间,ppt一般都是用一次就丢弃.而工程师对于设计的中间汇报,或三维bim汇报,评审汇报,展示汇报等,都可以直接用cad软件,方法是用视 ...
- 微信小程序开发--背景图显示
这两天开发微信小程序,在设置背景图片时,发现在wxss里面设置 background-image:(url) 属性,不管是开发工具还是线上都无法显示.经过查资料发现,background-image ...
- 腾讯云Centos安装jdk8
1.下载jdk1.8的tar cd /usr/local/src #切换到该目录下 wget url #下载jdk8的tar包 2.下载完成后解压tar包 tar -zxvf jdk-8u152-li ...