<!DOCTYPE html>

<html>

	<head>

		<meta charset="UTF-8">

		<title>全选、反选</title>

	</head>

	<body>

		<form>

			<input type="checkbox" name="" id="all" onclick="selectAll();" />全选<br />

			<hr /><br />

			<input class="chk" type="checkbox" name="chk" onclick="selectSingle();" />菜单一<br /><br />

			<input class="chk" type="checkbox" name="chk" onclick="selectSingle();" />菜单二<br /><br />

			<input class="chk" type="checkbox" name="chk" onclick="selectSingle();" />菜单三<br /><br />

			<input class="chk" type="checkbox" name="chk" onclick="selectSingle();" />菜单四<br /><br />

		</form>

		<script type="text/javascript" >

			var dom=document.getElementById('all');

			var doms=document.getElementsByName('chk');

			function selectAll(){

				var len = doms.length;

				for(var i=0;i<len;i++){

					if(dom.checked){

						doms[i].checked=true;

					}else{

						doms[i].checked=false;

					};

				}

			};

			function selectSingle(){

				let len = 0;

				let count = doms.length;

				for(var i=0;i<count;i++){

					if(doms[i].checked==true){

						len++;

					}

				}

				if (count == len) {

					dom.checked = true;

				}else{

					dom.checked = false;

				}

			}

		</script>

	</body>

</html>

　　

javascript实现复选框单选多选！的更多相关文章

  1. 使用vue实现复选框单选多选

    界面样式: <div class="right_con" v-if="isClickApply" style="border:none" ...

  2. [CSS]复选框单选框与文字对齐问题的研究与解决.

    前言:今天碰到的这个问题, 恰好找到一个很好的博文, 在这里转载过来 学习下. 原文地址:复选框单选框与文字对齐问题的研究与解决. 目前中文网站上面的文字,就我的个人感觉而言,绝大多数网站的主流文字大 ...

  3. ylbtech-数据库设计与优化-对作为复选框/单选列表的集合表的设计

    ylbtech-DatabaseDesgin:ylbtech-数据库设计与优化-对作为复选框/单选列表的集合表的设计 -- DatabaseName:通用表结构-- -- 主要是针对将要设计的表对象, ...

  4. 关于SWT常用组件(按钮,复选框,单选框(Button类))

    Button是SWT中最常用的组件.Button类的继承关系图: Button类的构造方法是newe Button(Composite parent,int style)它有两个参数: 第一个参数:是 ...

  5. MFC控件编程之复选框单选框分组框

    MFC控件编程之复选框单选框分组框 一丶分组框 分组框 英文叫做 GroubBox 添加了分组框主要就是分组.好看.不重点介绍 二丶单选框 英文: Raido Button 单选框需要注意的事项 1. ...

  6. 【JavaScript】实现复选框的全选、全部不选、反选

    以较为简洁的程序实现复选框的全选.全部不选.反选 操作. 并且将可变的部分设置为JS的参数,以实现代码复用. 全选和全不选 第一个参数为复选框名称,第二个参数为是全选还是全部不选. function ...

  7. ztree根据参数动态控制是否显示复选框/单选框(静态JSON数据)

    本文不再更新,可能存在内容过时的情况,实时更新请访问原地址:ztree根据参数动态控制是否显示复选框/单选框(静态JSON数据): 现有全省各地区静态JSON数据,现在想通过Url参数,动态控制是否显 ...

  8. js实现复选框的全选、全不选、反选

    js中实现复选框的全选,全不选以及反选,分为两种情况: (1)选中“请选择”前面的复选框实现全选,不选中“请选择”前面的复选框实现全不选 <!DOCTYPE html PUBLIC " ...

  9. JQ实现复选框的全选反选不选

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

随机推荐

  1. Oracle中用户和方案的区别

    从定义中我们可以看出方案(Schema)为数据库对象的集合,为了区分各个集合,我们需要给这个集合起个名字,这些名字就是我们在企业管理器的方案下看到的许多类似用户名的节点,这些类似用户名的节点其实就是一 ...

  2. mac phpstrom 环境配置

    因为mac下自带php,但是没有环境(ini文件)所有需要自己重新安装一下: curl -s http://php-osx.liip.ch/install.sh | bash -s 5.5 # 5.5 ...

  3. redis集群搭建与管理

    集群简介: Redis 集群是一个可以在多个 Redis 节点之间进行数据共享的设施(installation). Redis 集群不支持那些需要同时处理多个键的 Redis 命令, 因为执行这些命令 ...

  4. MySQL数据操作(借鉴)

    /* 启动MySQL */net start mysql /* 连接与断开服务器 */mysql -h 地址 -P 端口 -u 用户名 -p 密码 /* 跳过权限验证登录MySQL */mysqld ...

  5. npm install warning: no description; no repository field

    npm install 报错:warning no description; no repository field 开始以为必须npm init,npm init在git bash(win7)里,还 ...

  6. 生成证书，用于签名Android应用

    1. keytool 命令 1)使用JDK中的一个命令keytool,都有哪些命令呢,使用 keytool -help 进行查看 2)本次使用 keytool -genkeypair 命令生成签名,查 ...

  7. deepin ubuntu等创建桌面快捷方式

    Linux网上下载软件一般只会有.sh结尾执行程序.并不会像商店下载一样自动创建桌面图标.此时需要自行进行编辑. #创建一个桌面图标后缀名为.desktop touch myDesktop.deskt ...

  8. VMware workstation 虚拟机安装帮助文档（以windows server 2003为例）

    本次安装以Windows server 2003为例: 1.在桌面上双击VMware快捷方式打开,并点击文件>新建虚拟机 2.这里选择默认的“典型”,点击下一步 3.选择浏览,找到windows ...

  9. 转 delete 和 delete []的真正区别

    c++中对new申请的内存的释放方式有delete和delete[两种方式,到底这两者有什么区别呢? 1.我们通常从教科书上看到这样的说明:delete 释放new分配的单个对象指针指向的内存dele ...

  10. POJ-2429 GCD & LCM Inverse---给出gcd和lcm求原来两个数

    题目链接: https://cn.vjudge.net/problem/POJ-2429 题目大意: 给出两个数的gcd和lcm,求原来的这两个数(限定两数之和最小). 解题思路: 首先,知道gcd和 ...