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

实现代码:

<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. BFOA

    #include <stdio.h> #include <stdlib.h> #include <string.h> #include <time.h> ...

  2. Clojure:解决Selmer与AngularJS的 标签混淆问题

    Selmer是Clojure的一个模板类库,下面是它的一个DEMO模板: <ul> {% for item in items %} <li>{{item}}</li> ...

  3. ubuntu上java的运行环境jre的安装

    如何在Ubuntu 14.04上面安装 java的运行环境 jre 呢,下面直接采用到 oracle 的java 官网下载  对应的 jre 的tar.gz的包 从 root用户切换到 saynoer ...

  4. Xsolla与蜗牛一起共创黑金

    Xsolla和蜗牛游戏强强合作,公布了黑金在线,是中国知名网络游戏武术时代的一个新项目. Xsolla与蜗牛黑金 2014年6月10日至20日,蜗牛的黑金在线首次在美国洛杉矶E3展会上亮相. 该游戏官 ...

  5. PHP发展的现状和前景

    本人小菜鸟一仅仅,为了自我学习和交流PHP(jquery,linux,lamp,shell,javascript,server)等一系列的知识.小菜鸟创建了一个群. 希望光临本博客的人能够进来交流.寻 ...

  6. Codeforces Round #Pi (Div. 2) —— C-Geometric Progression

    题意: 如今有n个数,然后给出一个数k(代表的是等比数列中的那个公比),然后第二行给出n个数,代表的是这个序列. 最后的问题是叫你找出在这个序列中满足公比为k的三个数有几种.并输出方案总数. 思路: ...

  7. cocos2dx编译安卓版本号查看C++错误

    首先,在Mac以下相关软件路径,打开"终端",然后输入  pico .bash_profile  回车 export COCOS2DX_ROOT=/Users/bpmacmini0 ...

  8. 2014年辛星解读css第二节

    第一节我们简单介绍了一下CSS的工作流程,我相信读者会有一个大体的认识,那么接下来我们将会深入的研究一下CSS的细节问题,这些问题的涉及将会使我们的工作更加完好. *************凝视*** ...

  9. extjs_07_combobox&amp;tree&amp;chart

    1.combobox <%@ page language="java" import="java.util.*" pageEncoding="U ...

  10. CentOS 安装 MRTG 软件完成后的 403 Forbidden(转载)

    用 yum 安装 MRTG 並设定好之后也把 apache 的 httpd.conf 加上 mrtg 的目录,但 http://server/mrtg 卻一直出現 403 Forbidden.在 ht ...