[javascript]代码库
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>全选反选全不选</title>
<script type="text/javascript">
/*
全选:当单击全选按钮的时候,触发事件。
*/
//全选触发的事件
function checkAll(node){
//获取所有name为hobby的input标签
var inputs = document.getElementsByName("hobby");
//遍历所有的input标签
for(var i=0;i<inputs.length;i++){
//inputs[i].checked = true;
//全选按钮的状态和其他复选框的状态一致
inputs[i].checked = node.checked;
}
}
//反选事件
function check(){
//获取所有name为hobby的input标签
var inputs = document.getElementsByName("hobby");
/*
当前的复选框没有选中,就把它选中,如果已经选中状态,就改成未选中状态
*/
for(var i=0;i<inputs.length;i++){
/*使用判断来获取当权的复选框是否被选中
if( inputs[i].checked ){
inputs[i].checked = false;
}else{
inputs[i].checked = true;
}*/
inputs[i].checked = inputs[i].checked?false:true;
}
}
</script>
</head>
<body>
<input type="checkbox" name="hobby" />C<br/>
<input type="checkbox" name="hobby"/>Java<br/>
<input type="checkbox" name="hobby"/>PHP<br/>
<input type="checkbox" name="hobby"/>C#<br/>
<input type="checkbox" name="hobby"/>C++ <br/>
<input type="checkbox" onclick="checkAll(this)"/>全选/全不选 <br/>
<input type="checkbox" onclick="check()"/>反选
</body>
</html>