js实现表单checkbox的单选,全选
全选&单选
//<input type="checkbox" name="" class="quan" value="" />全选
//<input type="checkbox" name="" class="dan" value="" />单选
//<input type="checkbox" name="" class="dan" value="" />单选
//<input type="checkbox" name="" class="dan" value="" />单选
//<input type="checkbox" name="" class="dan" value="" />单选
//<input type="checkbox" name="" class="quan" value="" />全选
<script src="js/jquery-1.11.3.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
var $checke_q = $(".quan"); //全选按钮
var $checke_d = $(".dan"); //单选按钮
$checke_q.click(function() {
var that = this;
$checke_d.each(function() { //所有的单选按钮跟随选中的多选按钮变化
this.checked = that.checked;
})
$checke_q.each(function(){ //所有的多选按钮跟随选中的多选按钮变化
this.checked=that.checked;
})
})
$checke_d.change(function() {
let count = 0; //单选 按钮 个数
$checke_d.each(function() {
if(this.checked) {
count ++;
}
})
if(count == $checke_d.length) { //当count等于单选按钮的个数时 说明单选按钮全部选中了,此时多选按钮也该被选中
$checke_q.each(function() {
this.checked = true;
})
} else {
$checke_q.each(function() {
this.checked = false;
})
}
})
</script>
js实现表单checkbox的单选,全选的更多相关文章
- checkbox的单选全选,反选,计算价格,删除
activity_main.xml <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android&qu ...
- 简单的jquery表单验证+添加+删除+全选/反选
//布局 <body> <h4><a href="#">首页</a>><a href="#"> ...
- 表单Checkbox全选反选全不选
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- jquery.form.js 让表单提交更优雅
jquery.form.js 让表单提交更优雅.可以页面不刷新提交表单,比jQuery的ajax提交要功能强大. 1.引入 <script src="/src/jquery-1.9.1 ...
- Vue.js:表单
ylbtech-Vue.js:表单 1.返回顶部 1. Vue.js 表单 这节我们为大家介绍 Vue.js 表单上的应用. 你可以用 v-model 指令在表单控件元素上创建双向数据绑定. v-mo ...
- js验证表单大全
js验证表单大全 1. 长度限制 <script> function test() { if(document.a.b.value.length>50) { alert(" ...
- JS 更改表单的提交时间和Input file的样式
JS转换时间 function renderTime(data) { var da = eval('new ' + data.replace('/', '', 'g').replace('/', '' ...
- js动态控制表单表格
js动态控制表单表格,这里操作只讲,添加一行,删除一行,删除某一行某一列. 直接放代码: <!DOCTYPE html> <html> <head> <met ...
- 利用JS提交表单的几种方法和验证(必看篇)
第一种方式:表单提交,在form标签中增加onsubmit事件来判断表单提交是否成功 ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 <scr ...
随机推荐
- js的几种循环语句
//js种的循环语句 //while与do while的区别是while是满足条件后才执行 //do while是不管满不满足条件都会执行一次 //for 循环与while,do while相比循环结 ...
- Library Project里面使用Case语句判断R.id值报错。case expressions must be constant expressions
原文地址:http://blog.csdn.net/wchinaw/article/details/7325641 在一般的Android项目里R里面的资源声明看起来是这样的: public stat ...
- Hackrank Candies DP
题目链接:传送门 题意: n个学生站一行,老师给每个学生发至少一个糖 相邻学生,a[i] > a[i-1] 的话,那么右边学生的糖一定要发得比左边学生的糖多 问你满足条件这个老师总共最少的发多少 ...
- 改进Source Insight对汉字的支持
转自:http://blog.chinaunix.net/u/8681/showart_1356633.html http://blog.163.com/zhuzhihuacan@126/blog/s ...
- 60年代进程 80年代线程 IPC How the Java Virtual Machine (JVM) Works
小结: 1. To facilitate communication between processes, most operating systems support Inter Process C ...
- POJ - 3177 Redundant Paths(边双连通分支)(模板)
1.给定一个连通的无向图G,至少要添加几条边,才能使其变为双连通图. 2. 3. //边双连通分支 /* 去掉桥,其余的连通分支就是边双连通分支了.一个有桥的连通图要变成边双连通图的话, 把双连通子图 ...
- HDU - 4333 Revolving Digits(拓展kmp+最小循环节)
1.给一个数字字符串s,可以把它的最后一个字符放到最前面变为另一个数字,直到又变为原来的s.求这个过程中比原来的数字小的.相等的.大的数字各有多少. 例如:字符串123,变换过程:123 -> ...
- BZOJ_5369_[Pkusc2018]最大前缀和_状压DP
BZOJ_5369_[Pkusc2018]最大前缀和_状压DP Description 小C是一个算法竞赛爱好者,有一天小C遇到了一个非常难的问题:求一个序列的最大子段和. 但是小C并不会做这个题,于 ...
- sqlserver2008Mail
use msdb GO DROP PROC MailTim GO CREATE PROC MailTim @Subject NVARCHAR(100),@Body NVARCHAR( ...
- 13_传智播客iOS视频教程_OC程序的编译链接
C程序的编译.链接.执行怎么来的?在.C文件里面写上符合C语言部分的源代码.OC也是一样的.记住:OC程序的后缀名是.m. 为什么要链接?第一个.o的目标文件里面它启动不了.因为它没有启动代码我们要加 ...