<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<h1>你的呢愛(ài)好很廣泛?。?/span></h1>
<br>
<input type="checkbox" name="checkItems" id="checkItems" value="全選/全不選">全選/全不選
<br>
<input type="checkbox" name="items" value="足球">足球
<input type="checkbox" name="items" value="籃球">籃球
<input type="checkbox" name="items" value="游泳">游泳
<input type="checkbox" name="items" value="唱歌">唱歌
<br>
<input type="button" name="checkall" id="checkall" value="全選">
<input type="button" name="checkall" id="checkNo" value="全不選">
<input type="button" name="checkall" id="checkReverse" value="反選">
<script type="text/javascript">
// 處理全選
document.getElementById('checkall').onclick=function(){
/*************************************************/
// 獲取所有的復(fù)選框
var checkElements=document.getElementsByName('items');
for(var i=0;i<checkElements.length;i++){
var checkElement=checkElements[i];
// 方法一
// checkElement.setAttribute('checked',' checked');
// 方法二
checkElement.checked="checked";
}
}
/*************************************************/
// 處理全不選
document.getElementById('checkNo').onclick=function(){
// 獲取所有的復(fù)選框
var checkElements=document.getElementsByName('items');
for(var i=0;i<checkElements.length;i++){
var checkElement=checkElements[i];
// 方法一火狐不支持
// checkElement.setAttribute('checked',null);
// 方法二火狐和ie都支持
checkElement.checked=null;
}
}
/******************************************************************/
//反選
document.getElementById('checkReverse').onclick=function(){
// 獲取所有的復(fù)選框
var checkElements=document.getElementsByName('items');
for(var i=0;i<checkElements.length;i++){
var checkElement=checkElements[i];
if (checkElement.checked) {
checkElement.checked=null;
}
else{
checkElement.checked="checked";
}
// 方法一
// checkElement.setAttribute('checked',null);
// 方法二火狐和ie都支持
}
}
/***********************************************************/
//全選/不選
document.getElementById('checkItems').onclick=function()
{
// 獲取所有的復(fù)選框
var checkElements=document.getElementsByName('items');
if (this.checked) {
for(var i=0;i<checkElements.length;i++){
var checkElement=checkElements[i];
checkElement.checked="checked";
}
}
else{
for(var i=0;i<checkElements.length;i++){
var checkElement=checkElements[i];
checkElement.checked=null;
}
}
}
</script>
</body>
</html>

久久精品国产中国久久|日韩免费无码人妻一区|五月天婷婷精品免费视频|国产福利酱国产一区二区|国产欧美日韩亚洲黄色一级|精品国产亚洲欧美在线观看|亚洲AV丝袜高跟鞋在办公室|不卡av日韩一区二区在线观看