设置一个全选选框和四个子选框,要实现点击全选后四个子选框选中,取消全选后四个子选框也取消。全选后点击某个子选框,全选也能取消。当四个子选框都选中时,全选框也被选择。

实现代码:

<script>
var a=document.getElementById("a");
var b=document.getElementsByClassName("b");
//全选与取消全选
var y=true;
a.onchange=function(){ if(a.checked){
for (var i=0;i<b.length;i++)
b[i].checked = true;
}else{
for (var i=0;i<b.length;i++) {
b[i].checked =false; };
}; };
//子选框选择判定全选选框(第一种实现方法)
for (var i=0;i<b.length;i++) {
b[i].onchange=function(){
a.checked = true;
for (var i=0;i<b.length;i++) {
if (!b[i].checked) {
a.checked=false;
break;
} } }
} //子选框选择判定全选(第二种实现方法) // var n = 0;
// for (var i=0;i<b.length;i++) {
// b[i].onchange=function(){
// n = 0;
// for(var i = 0; i < b.length; i++)
// {
// if(b[i].checked==true){
// n++;
// }
// if(n>=4){
// alert(n);
// a.checked = true;
// } else{
// a.checked = false;
// }
//
// }
// }
//}

  

js 全选选框与取消全选代码的更多相关文章

  1. 点击div全选中再点击取消全选div里面的文字

    想做一个就是点击一个div然后实现的功能是div里面的文字都成选中状态,然后就可以利用浏览器的自带的复制功能,任意复制在哪里去了 在网上百度了一下 然后网上的答案感觉很大的范围 然后一些搜索 然后就锁 ...

  2. Android开发CheckBox控件,全选,反选,取消全选

    在Android开发中我们经常会使用CheckBox控件,那么怎么实现CheckBox控件的全选,反选呢 首先布局我们的界面: <?xml version="1.0" enc ...

  3. JavaScript实现单击全选 ,再次点击取消全选

                 以下为实现思路,已测试,供参考 var allSet = document.getElementById('allSet');//获取全选按钮元素 var a = allSe ...

  4. js弹出确认框,挺全

    一种: <a href="javascript:if(confirm('确实要删除该内容吗?'))location='http://www.google.com'">弹 ...

  5. js select下拉框下拉跳转代码

    下拉跳转原理很简单这个用到了select的onchangeg事件,只要这里改变我们就获取select值直接location.href=this.value即可. <select name=&qu ...

  6. JS或jQuery实现一组复选框的全选和取消全选?

    //1.JS方式实现:checkbox 全选/取消全选  var isCheckAll = false;  function swapCheck() {    if (isCheckAll) {    ...

  7. jQuery 复选框全选/取消全选/反选

    jQuery实现的复选框全选/取消全选/反选及获得选择的值. 完整代码: <!DOCTYPE html> <html> <head> <script type ...

  8. 前端之 JS 实现全选、反选、取消选中

    需求 制作如下可选表格,实现“全选”.“反选”.“取消”功能 代码示例 <!DOCTYPE html> <html lang="zh-CN"> <he ...

  9. js全选与取消全选

    实现全选与取消全选的效果 要求1(将军影响士兵):点击全选按钮,下面的复选框全部选中,取消全选按钮,下面的复选框全部取消 思路:复选框是否被选中,取决于check属性,将全选按钮的check属性值赋值 ...

随机推荐

  1. 在Python脚本中调用Django环境(方便、右键运行,可用于ORM测试)

    随便创建一个py文件即可: import os if __name__ == '__main__': os.environ.setdefault("DJANGO_SETTINGS_MODUL ...

  2. PHP开发错误锦集(持续更新)

    1.trait 命名问题. 问题:trait 里定义的方法找不到 <?php namespace app\controllers; trait Example { public function ...

  3. 洛谷 P2155 BZOJ 2186 codevs 2301 [SDOI2008]沙拉公主的困惑

    题目描述 大富翁国因为通货膨胀,以及假钞泛滥,政府决定推出一项新的政策:现有钞票编号范围为1到N的阶乘,但是,政府只发行编号与M!互质的钞票.房地产第一大户沙拉公主决定预测一下大富翁国现在所有真钞票的 ...

  4. noip模拟赛 fateice-or

    分析:or操作只有在结果的这一位为0的情况下才会强制要求两个数的这一位都为0,其它时候不强求,所以为了最大限度地满足条件,我们先把所有的数的所有位全部变成1,如果p的第i位为0,那么[l,r]的数的第 ...

  5. NEMA-0183(GPRMC GPGGA)详细解释

    NEMA-0183(GPRMC GPGGA)详细解释 nmea数据如下:  $GPGGA,121252.000,3937.3032,N,11611.6046,E,1,05,2.0,45.9,M,-5. ...

  6. 洛谷 P3078 [USACO13MAR]扑克牌型Poker Hands

    P3078 [USACO13MAR]扑克牌型Poker Hands 题目描述 Bessie and her friends are playing a unique version of poker ...

  7. [Cypress] Test XHR Failure Conditions with Cypress

    Testing your application’s behavior when an XHR call results in an error can be difficult. The use o ...

  8. Notepad++支持jQuery、html5、css3

    Notepad++里的代码提示文件是以XML文件存放于目录 ....\Notepad++\plugins\APIs\下的. 将这三个文件:html.xml, css.xml, javascript.x ...

  9. SQL2000数据库定期自动备份与修改

    SQL2000数据库定期自动备份与修改 http://www.veryhuo.com 2009-11-19 烈火网 投递稿件 我有话说   在SQL server企业管理器中,可以设置数据库的定期自动 ...

  10. hdu 1233(最小生成树 prim算法)

    还是畅通工程 Time Limit: 4000/2000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)Total Subm ...