标签:
<!DOCTYPE html> | |
<html> | |
<head> | |
<title>多选框</title> | |
<meta charset="utf-8"> | |
<style> | |
*{margin:20; padding:0;} | |
</style> | |
</head> | |
<body> | |
<ul> | |
<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> | |
<li><input type="checkbox">白菜</li> | |
<li><input type="checkbox">白菜</li> | |
<li><input type="checkbox">情人结</li> | |
<button onclick="change1(true)">全选</button> | |
<button onclick="change1(false)">不全选</button> | |
<button onclick="change3()">反选</button> | |
<li><input onclick="change(this)" type="checkbox">点点</li> | |
</ul> | |
<script> | |
var obj=document.getElementsByTagName(‘input‘); | |
function change1(res){ | |
for(var i=0;i<obj.length;i++){ | |
obj[i].checked=res; | |
} | |
} | |
function change(num){ | |
for(var i=0;i<obj.length;i++){ | |
obj[i].checked = num.checked | |
} | |
} | |
function change3(){ | |
for(var i=0;i<obj.length;i++){ | |
if(obj[i].checked==true){ | |
obj[i].checked=false; | |
}else{ | |
obj[i].checked=true; | |
} | |
} | |
} | |
</script> | |
</body> | |
</html> |
标签:
原文地址:http://www.cnblogs.com/-qiang/p/5787299.html