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 ...
随机推荐
- nginx 的precontent阶段的ngx_http_try_files_module模块与mirrors模块介绍
指令介绍 Syntax: try_files file ... uri; try_files file ... =code; Default: — Context: server, location ...
- http://www.yyne.com/python使用-urllib-quote-进行-url-编码小技巧/
http://www.yyne.com/python使用-urllib-quote-进行-url-编码小技巧/
- 计划任务之一次性计划任务(at)和周期性计划任务(crontab)(重点)
一:知识要点 ----计划任务的意义----计划任务分类----用户计划任务crontab----系统计划任务----计划任务使用注意事项----anacron服务介绍 二:计划任务的意义计划任务 - ...
- Python - ORM(数据库相关)
1. 概念 目标:类/对象操作 -> SQL语句 -> DB API -> 再在数据库中执行.ORM做前两部,因为ORM本身无法操作数据库.参考:https://baike.baid ...
- Kibana7.3.2与ElasticSearch7.3.2的集成
上接: Ubuntu18.04 ElasticSearch7.3.2集群搭建 上传二进制包解压到指定目录, 修改目录名 tar -xzvf tar xzvf kibana-6.3.2-linux-x8 ...
- python第三方库介绍
- kibana 删除document或者type
// 删除某个document DELETE /索引名称/type名称/document编号(id) // 删除整个type PUT 索引名称/type名称/_delete_by_query?conf ...
- Percona-Toolkit 之 pt-kill 用法
生产环境中我们时常遇到这样的情况,数据库性能恶劣,需要马上杀掉部分会话,不然数据库就夯死.我们可以先找show processlist的输出来杀会话,但是比较麻烦.pt-kill为我们解决了杀会话问题 ...
- python 开启http服务并下载文件
Python <= 2.3python -c "import SimpleHTTPServer as s; s.test();" 8000 Python >= 2.4p ...
- SpringBoot整合MyBatis获得插入数据后获取主键,返回值总是1
xml里的写法 <insert id="insertLogin" parameterType="com.xyt.p2p.pojo.LoginInfo" k ...