全选&单选

	//<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的单选,全选的更多相关文章

  1. checkbox的单选全选,反选,计算价格,删除

    activity_main.xml <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android&qu ...

  2. 简单的jquery表单验证+添加+删除+全选/反选

    //布局 <body> <h4><a href="#">首页</a>><a href="#"> ...

  3. 表单Checkbox全选反选全不选

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  4. jquery.form.js 让表单提交更优雅

    jquery.form.js 让表单提交更优雅.可以页面不刷新提交表单,比jQuery的ajax提交要功能强大. 1.引入 <script src="/src/jquery-1.9.1 ...

  5. Vue.js:表单

    ylbtech-Vue.js:表单 1.返回顶部 1. Vue.js 表单 这节我们为大家介绍 Vue.js 表单上的应用. 你可以用 v-model 指令在表单控件元素上创建双向数据绑定. v-mo ...

  6. js验证表单大全

    js验证表单大全 1. 长度限制 <script> function test() { if(document.a.b.value.length>50) { alert(" ...

  7. JS 更改表单的提交时间和Input file的样式

    JS转换时间 function renderTime(data) { var da = eval('new ' + data.replace('/', '', 'g').replace('/', '' ...

  8. js动态控制表单表格

    js动态控制表单表格,这里操作只讲,添加一行,删除一行,删除某一行某一列. 直接放代码: <!DOCTYPE html> <html> <head> <met ...

  9. 利用JS提交表单的几种方法和验证(必看篇)

    第一种方式:表单提交,在form标签中增加onsubmit事件来判断表单提交是否成功 ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 <scr ...

随机推荐

  1. ubuntu怎么打开.7z和.rar的压缩文件

    通过 sudo apt-get install p7zip-rar就会自己主动安装p7zip-full和p7zip-rar两个软件. 之后就能够通过鼠标右键选择 提取到此处 直接解压压缩文件. den ...

  2. 基于docker容器搭建fastdfs分布式文件系统

    本次环境的搭建参考了 https://blog.csdn.net/qq_43455410/article/details/84797814, 感谢博主. 主要流程如下: 1. 下载fastdfs镜像 ...

  3. while语句字符串的基本操作

    1,编码:对现在通用文字编码成计算机文字,便于储存,传递,交流. 最早的计算机编码是ACSII美国人创建的,包含英文字母,数字,以及特殊符号.总共是128个码位:2**7,因为计算机的底层只能识别:& ...

  4. debian repository的成长过程

    1 基本概念 1.1 健康的安装 在端系统中的一次健康的安装指的是,在安装的包的集合中,所有的依赖都满足,并且没有冲突存在. 这的健康的安装是相对于端系统而言的,并不是相对于整个repo而言的.对整个 ...

  5. mysql 时间间隔计算

    业务需求说明 早8:30点执行该sql,写入定时脚本 [在稳定前,需要手动复检] INSERT INTO test_error ( url, no_open_times, no_ad_times, o ...

  6. 设计模式-(7)桥接(swift版)

    一,概念 桥接模式为把抽象层次结构从实现中分离出来,使其可以独立变更,抽象层定义了供客户端使用的上层抽象接口,实现层次结构定义了供抽象层次使用的底层接口,实现类的引用被封装于抽象层的实例中,桥接就形成 ...

  7. Lightoj 1007 - Mathematically Hard

    1007 - Mathematically Hard    PDF (English) Statistics Forum Time Limit: 2 second(s) Memory Limit: 6 ...

  8. codeforces 689A A. Mike and Cellphone(水题)

    题目链接: A. Mike and Cellphone time limit per test 1 second memory limit per test 256 megabytes input s ...

  9. 使用VirtualBox虚拟机搭建局域网

    参考资料: http://www.awaimai.com/995.html https://my.oschina.net/cofecafe1/blog/206535 最近公司局域网网络改造,在改造前已 ...

  10. Application 效能分析有妙招 — 使用 perf 走天下(转载)

    转载:http://tech.mozilla.com.tw/posts/1803/application-%E6%95%88%E8%83%BD%E5%88%86%E6%9E%90-%E4%BD%BF% ...