html代码

<input type="checkbox" id="all" />all</input>
<input type="checkbox" class="one" onClick="funSelOne(this)"/>aa</input>
<input type="checkbox" class="one" onClick="funSelOne(this)"/>aa</input>
<input type="checkbox" class="one" onClick="funSelOne(this)"/>aa</input>
<input type="checkbox" class="one" onClick="funSelOne(this)"/>aa</input>

js代码:

$("#all").click(function(){     #给全选按钮添加点击事件,实现全选或全不选功能
var xz = $(this).prop("checked");
var ck = $(".one").prop("checked",xz);
}) function funSelOne(){      #关联全选按钮与子按钮,当任意一个子按钮没被选中时,全选按钮不被选中,当所有按钮都选中时,全选按钮也被选中
var one=$(".one");
var all=$("#all")[0]
var selCount=0;
var unSelCount=0;
for(var i=0;i<one.length;i++){
if(one[i].checked==true){selCount++;}
if(one[i].checked==false){unSelCount++;}
if(selCount==one.length){$('#all').prop("checked",true);}
if(unSelCount>0){$('#all').prop("checked",false);}
}
}

参考:https://www.cnblogs.com/xiaofox0018/p/6243723.html

https://blog.csdn.net/liuhailiuhai12/article/details/53815039

html javascript checkbox实现全选功能的更多相关文章

  1. asp:DataGrid之添加asp:CheckBox做全选功能时涉及到绑值问题解决

    最大的意图是为asp:CheckBox的value绑定上自己需要的value值,而不是默认的字符串"on" 参考了这篇文章带Value属性的扩展CheckBox控件,意义不大,换了 ...

  2. JavaScript CheckBox实现全选和部分选择

    <html> <head> <script> function BatchAddToBasket() { var questionNums = ''; var ch ...

  3. Form - CHECKBOX全选功能

    FORM BUILDER开发,遇到这样一个需求: 添加一个CHECKBOX完成全选功能,红框为新添加的CHECKBOX(如图示) Try to use APP_RECORD.FOR_ALL_RECOR ...

  4. S全选功能代码

    JS全选功能代码优化 2014-06-26 00:00 by 龙恩0707, 470 阅读, 3 评论, 收藏, 编辑 JS全选功能代码优化 最近在看javascript MVC那本书,也感觉到自己写 ...

  5. JQUERY的给Check全选功能

    //给Checkbox提供全选功能 $("#checkall").click(function(){ if(this.checked){ $("input[name='c ...

  6. js初学—实现checkbox全选功能

    布局如下: <p ><input type="checkbox" id="che1"/>全选</p><div id=& ...

  7. C# winform中的datagridview控件标头加入checkbox,实现全选功能。

    /// <summary> /// 给DataGridView添加全选 /// </summary> public class AddCheckBoxToDataGridVie ...

  8. Android高级控件(一)——ListView绑定CheckBox实现全选,增加和删除等功能

    Android高级控件(一)--ListView绑定CheckBox实现全选,增加和删除等功能 这个控件还是挺复杂的,也是项目中应该算是比较常用的了,所以写了一个小Demo来讲讲,主要是自定义adap ...

  9. JavaScript实现全选功能

    最终效果: 代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> < ...

随机推荐

  1. Centos6.8安装mysql 步骤

    第1步.查看CentOS下是否已安装mysql 输入命令 :yum list installed | grep mysql 第2步.删除已安装mysql 输入命令:yum -y remove mysq ...

  2. DOCKER学习_013:Dockerfile配置指令ENTRYPOINT详解

    前面已经介绍了一些Dockerfile的一些指令,对于ENTRYPOINT和CMD也有介绍实验 一 ENTRYPOINT和CMD配置使用 ENTRYPOINT相当于CMD,是配置容器后的一个指令,但是 ...

  3. Redux 原理和简单实现

    前端开发中React + Redux 是大部分项目的标配,Redux也是我喜欢的库之一,他的源码也拜读过几遍,每次都有很多收获,尤其他的中间件设计模式,对自己封装一些库提供了思想上的指导. Redux ...

  4. GO汇编-函数

    GO汇编-函数 终于到函数了!因为Go汇编语言中,可以也建议通过Go语言来定义全局变量,那么剩下的也就是函数了.只有掌握了汇编函数的基本用法,才能真正算是Go汇编语言入门.本章将简单讨论Go汇编中函数 ...

  5. 在微信框架模块中,基于Vue&Element前端的微信公众号和企业微信的用户绑定

    在一个和微信相关的业务管理系统,我们有时候需要和用户的微信账号信息进行绑定,如对公众号.企业微信等账号绑定特定的系统用户,可以进行扫码登录.微信信息发送等操作,用户的绑定主要就是记录公众号用户的ope ...

  6. SQL Server 动态创建表结构

    需求是,在word里面设计好表结构(主要在word中看起来一目了然,方便维护),然后复制sql 里面,希望动态创建出来 存储表结构的表 CREATE TABLE [dbo].[Sys_CreateTa ...

  7. 网络模型mAP计算实现代码

    网络模型mAP计算实现代码 一.mAP精度计算 这里首先介绍几个常见的模型评价术语,现在假设我们的分类目标只有两类,计为正例(positive)和负例(negtive)分别是: 1)True posi ...

  8. TensorFlow反向传播算法实现

    TensorFlow反向传播算法实现 反向传播(BPN)算法是神经网络中研究最多.使用最多的算法之一,用于将输出层中的误差传播到隐藏层的神经元,然后用于更新权重. 学习 BPN 算法可以分成以下两个过 ...

  9. CUDA C++编程接口:编译

    CUDA C++编程接口:编译 一.概述 CUDA C++为熟悉C++编程语言的用户提供了一个简单的路径,以方便地编写程序以执行该设备. 它由一组最小的扩展到C++语言和运行库. 在编程模型中引入了核 ...

  10. 5G和AI机器人平台

    5G和AI机器人平台 Qualcomm Launches 5G and AI Robotics Platform 高通技术公司(Qualcomm Technologies)周三推出了一款高级5G和人工 ...