怎么用JavaScript实现复选框的全部选择和全部取消

JavaScript013

怎么用JavaScript实现复选框的全部选择和全部取消,第1张

思路:获取复选框对象→循环设置ckecked属性值(true表示选中,false表示未选中)。关键代码:

obj.checked = true | false

实例演示如下:

1、HTML结构

<input type="checkbox" name="test" value="1">item-1

<input type="checkbox" name="test" value="2">item-2

<input type="checkbox" name="test" value="3">item-3<br>

<input type="checkbox" name="test" value="4">item-4

<input type="checkbox" name="test" value="5">item-5<br>

<input type="button" value="全选" onclick="setChecked(true)"><input type="button" value="取消" onclick="setChecked(false)">

2、javascript代码

function setChecked(option){

var cks = document.getElementsByName("test")

for(i=0i<cks.lengthi++){

cks[i].checked = option

}

}

3、效果演示

我把你的代码复制下来试了试,目前遇到的问题是

var lis = list.getElementsByTagName('input')

这行代码中lis的值无法获取到,然后我发现

var list = document.getElementById("one")

这行代码你获取的是id为one的元素,但是你的html代码里面并没有id为one的元素,所以你的lis没有获取到值,所以后面的代码都无效。

记住,class和id是不一样的getElementById获取的是id