功能
实现分为两大部分:
第一body 部分,1,通过
无序列表标签实现选项的基本样式,通过input的checkbox标签实现里面的复选框功能。用到了标签的嵌套。然后选项的js方法含有选中和被选中的功能。2,button按钮部分,通过标签,里面绑定onclick事件,来触发选项标签的函数功能。
第二,script部分。通过for循环,逐个遍历选项卡的各个checkd的状态,checkd= "checked"是选中状态,checkd =true“是选中状态,checkd = false 是未被选中状态。checkd = ”checkd"是默认选中状态。那么我们就可以通过改变input标签的checkd的状态是true还是false进而确定 是不是选中状态。对于反选,需要定义函数,遍历访问各个标签,如果checkd
为true,则让它为false。
代码;
Titlevar kuang =document.getElementsByTagName("input");
var anniu = document.getElementsByTagName("button");
function select(status) {
for (i=0;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;}
}
}
政治英语数学历史语文地理化学全选
全不选
反选
需求,如图 所示,实现右边的全选,全不选,反选