JS: 复选框——ALL与A、B、C(选中ALL同时选中各子项)
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
</style>
</head>
<body>
<input id="big" type="checkbox" onclick="bigChange(this)"/>ALL
<br />
<input name="small" type="checkbox" onclick="smallChange(this)" value=""/>A<br />
<input name="small" type="checkbox" onclick="smallChange(this)" value=""/>B<br />
<input name="small" type="checkbox" onclick="smallChange(this)" value=""/>C
</body>
</html>
<script type="text/javascript">
function bigChange(obj) {var smObj = document.getElementsByName("small");
if (obj.checked == false) {
for (var i = 0; i < smObj.length; i++)
smObj[i].checked = false;
}else {
for (var i = 0; i < smObj.length; i++)
smObj[i].checked = true;
}
}
function smallChange(obj) {
var smObj = document.getElementsByName("small");
var bigObj = document.getElementById("big");
if (obj.checked == false){
bigObj.checked = false;}
else {
var b = true;
for (var i = 0; i < smObj.length; i++) {
if (smObj[i].checked == true){
b = true;}
else{b=false;
break;}
}
if (b == true){
bigObj.checked = true;}
else{bigObj.checked=false;}
}
}
</script>
JS: 复选框——ALL与A、B、C(选中ALL同时选中各子项)的更多相关文章
- js 复选框 全选都选 如果某一个子复选框没选中 则全选按钮不选中
<!DOCTYPE HTML> <html> <head> <meta charset=UTF-8> <title>js 复选框 全选都选 ...
- js复选框全选反选
本篇文章是关于复选框的,有2种形式:1.全选.反选由2个按钮实现:2.全选.反选由一个按钮实现. <!DOCTYPE html> <html> <head> < ...
- Vue.js 复选框
demo <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <titl ...
- JS复选框选中
Web前端之复选框选中属性 熟悉web前端开发的人都知道,判断复选框是否选中是经常做的事情,判断的方法很多,但是开发过程中常常忽略了这些方法的兼容性,而是实现效果就好了.博主之前用户不少方法,经常 ...
- js复选框实现全选、全不选、反选
复选框为checkbox对象 通过input就可以将一个简单的复选框呈现在页面上 <input type="checkbox" /> 要实现的大概就是这样一个页面 思路 ...
- js复选框全选
<input name='chkAll' type='checkbox' id='chkAll' onclick='CheckAll(this.form)' value='checkbox'&g ...
- js复选框插件
<div class="selectList selectQgClass" id="selectQgClass"> <div class=&q ...
- js复选框操作
$(".checkall").click(function () { if (this.checked) { $ ...
- js 复选框回显
<div class="control-group"> <label class="control-label">客户状态:</l ...
随机推荐
- 【代码总结】GD库中添加图片水印
函数 getimagesize() bool imagecopymerge( resource dst_im, resource src_im, int dst_x, int dst_y, int s ...
- 吴裕雄 Bootstrap 前端框架开发——Bootstrap 网格系统实例:偏移列
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- Codeforces #617 (Div. 3)B. Food Buying
Mishka wants to buy some food in the nearby shop. Initially, he has ss burles on his card. Mishka ca ...
- 关于html的基本知识
先上基本介绍图 HTML 简介 超文本标记语言 Hyper Text Markup Language 什么是标签(大多数标签) 尖括号包围.成对出现 开始标签,结束标签 元素 编辑器 HBuilder ...
- H.264 中的Annex B格式和AVCC格式
首先要理解的是没有标准的H.264基本流格式.文档中的确包含了一个Annex,特别是描述了一种可能的格式Annex B格式,但是这个并不是一个必须要求的格式.标准文档中指定了视频怎样编码成独立的包,但 ...
- ATT&CK实战系列——红队实战(一)
一.环境搭建 1.环境搭建测试 最近想要开始学习内网渗透,搜集了一些教程,准备先实验一个vulnstack靶机,熟悉一下内网渗透操作再学习基础知识. 靶场下载地址:http://vulnstack.q ...
- HashSet原理
- 精易四周年限量纪念U盘(全套)
下载地址网盘:https://pan.baidu.com/s/1dFwPbiT
- 彻底搞懂 JS 中 this 机制
彻底搞懂 JS 中 this 机制 摘要:本文属于原创,欢迎转载,转载请保留出处:https://github.com/jasonGeng88/blog 目录 this 是什么 this 的四种绑定规 ...
- 三、java基础-方法含义_重载_递归
1.java中方法: 方法的含义: 就是一个代码片段,可以完后某个特定的功能,可以重复利用: 定义方法的语法: [方法的修饰符列表] 方法的返回值类型 方法名{ java语句; } 注意 ...