python练习题之全选框全不选反选
功能
实现分为两大部分：
第一body 部分，1，通过<li>无序列表标签实现选项的基本样式，通过input的checkbox标签实现里面的复选框功能。用到了标签的嵌套。然后选项的js方法含有选中和被选中的功能。
2，button按钮部分，通过<button>标签，里面绑定onclick事件，来触发选项标签的函数功能。
第二，script部分。通过for循环，逐个遍历选项卡的各个checkd的状态，checkd= "checked"是选中状态，checkd =true“是选中状态，checkd = false 是未被选中状态。checkd = ”checkd"是默认选中状态。那么我们就可以通过改变input标签的checkd的状态是true还是false进而确定 是不是选中状态。对于反选，需要定义函数，遍历访问各个标签，如果checkd
为true，则让它为false。
代码；
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<script>
var kuang =document.getElementsByTagName("input");
var anniu = document.getElementsByTagName("button");
function select(status) {
for (i=0;i<kuang.length;i++){
// 实现 全选 的功能，遍历，将每一个都选中.通过传递参数，checked属性的真假，true为选中，false为选错
kuang[i].checked = status
}
}
function selectReverse() {
for (var i =0 ; i <7;i++){
if (kuang[i].checked){kuang[i].checked =false;}
else {kuang[i].checked = true;}
}
} </script> <ul style="margin: 50px 30px 20px"> <li ><input type="checkbox" >政治</li>
<li ><input type="checkbox">英语</li>
<li ><input type="checkbox">数学</li>
<li ><input type="checkbox" >历史</li>
<li ><input type="checkbox">语文</li>
<li ><input type="checkbox" >地理</li>
<li ><input type="checkbox" >化学</li> </ul>
<button type="button" onclick="select(true)">全选</button>
<button type="button" onclick="select(false)">全不选</button>
<button type="button" onclick="selectReverse()" >反选</button> </body>
</html>
需求，如图 所示，实现右边的全选，全不选，反选
python练习题之全选框全不选反选的更多相关文章
- js 复选框 全选都选 如果某一个子复选框没选中 则全选按钮不选中
<!DOCTYPE HTML> <html> <head> <meta charset=UTF-8> <title>js 复选框 全选都选 ...
- JavaScript小例子：复选框全选
JavaScript小例子:复选框全选 这只是一个小例子,很简单,但是这个功能还是很常用的: 实现后效果如图: JavaScript代码: <script type="text/jav ...
- Jquery表格变色 复选框全选，反选
/*jquery静态表格变色*/ $(".tr2").mouseover(function(){ $(this).css("background"," ...
- 复选框全选、全不选和反选的效果实现VIEW:1592
<html> <head> <meta http-equiv="Content-Type" content="text/html; char ...
- html+css+js实现复选框全选与反选
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...
- checkbox复选框全选批量删除
多选框全选实现批量删除 html代码 <body> <form action="" method="post" name="Form ...
- toFixed（）精度丢失；复选框全选、取消
一.精度丢失和重写toFixed()函数 1.重写toFixed() Number.prototype.toFixed = function(length){ var carry = 0; //存放进 ...
- jQuery 复选框全选/取消全选/反选
jQuery实现的复选框全选/取消全选/反选及获得选择的值. 完整代码: <!DOCTYPE html> <html> <head> <script type ...
- js 判断 复选框全选、全不选、反选、必选一个
一个挺 使用的 js 代码片段, 判断 复选框全选.全不选.反选.必选一个 记录下, 搬来的 思路: 修改数据的 选中与否状态, 拿到所有的输入框,看是否有选中的状态 <html> & ...
- jQuery实现复选框 全选、反选、全不选
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <hea ...
随机推荐
- Java IO(1)
IO这一部分内容还是比较多的,对于基础的枯燥但是又重要的内容还是将它记下来比较好. 关于File类 Ø File类直接继承与Object类,File类描述了文件本身的一些属性,File类用来获取或者处 ...
- 远程操作 SQl server2008新建角色和数据库
远程操作 SQl server2008 1.windows身份登录,安全性-->登录名(右键)-->新建登录名:yc ,密码111111-->点选sql server身份验证--&g ...
- 《JAVA设计模式》之责任链模式(Chain of Responsibility)
在阎宏博士的<JAVA与模式>一书中开头是这样描述责任链(Chain of Responsibility)模式的: 责任链模式是一种对象的行为模式.在责任链模式里,很多对象由每一个对象对其 ...
- 《JAVA设计模式》之迭代器模式(Iterator)
在阎宏博士的<JAVA与模式>一书中开头是这样描述迭代子(Iterator)模式的: 迭代子模式又叫游标(Cursor)模式,是对象的行为模式.迭代子模式可以顺序地访问一个聚集中的元素而不 ...
- Mysql基础篇(笔记)
mysql数据库是由DB跟DBMS跟sql组成 DB 数据库仓库 DBMS 数据库管理系统 SQL 一门通用的数据库语言 数据库启动命令 : 关闭->net stop MySQL || 开启 ...
- MyBatis中的$和#，用不好，准备走人！
作者:程序猿的内心独白 https://m.toutiaocdn.com/i6685496024770806280 这是一次代码优化过程中发现的问题,在功能优化后发现部分数据查不到出来了,问题就在于一 ...
- [BZOJ3932][CQOI2015]任务查询系统(差分+主席树)
题面 分析 对于一个区间修改(s,e,v),我们可以将它差分,这样就变成了单点修改s和e+1(s插入,t+1删除) 我们用主席树维护差分数组的前缀和,第i棵主席树维护区间[1,i]之间的所有差分值 那 ...
- k3 cloud中库存转移处理
有个苗木基地的苗木要转移到另一个,是做那个单据 解决办法:两个基地是同一组织 做直接调拨单就行了 ,不同组织做调拨申请单,然后做 分布式调出 分布式调入
- JavaScript 内置对象 Array 数组
Array 数组 1.创建数组 构造函数 new Array() 小括号内可以是数组元素个数,也可以是数组项 数组字面量表示法 var arr = [1,2,3,4,5]; 2.数组长度 arr.le ...
- git 常用命令与上传步骤
git 上传步骤: git init 初始化Git仓库 git add . 提交你修改的文件 git status 查看项目当中的状态(红色代表的是 未add 的文件 绿色的是已 ...