すべて選択、選択解除、選択を反転する機能
すべてのチェックボックスの選択、選択解除、および選択解除は主に JavaScript スクリプトを使用し、カスタム関數(shù)によって実行されます。
(1) JavaScript スクリプトのカスタム関數(shù)を使用してチェック ボックスの選択、反転、および選択解除の機能を完了する際に、最初に適用されるメソッドは getElementsByTagName であり、
は指定されたタグの名前を取得し、戻り値は 1 つのオブジェクトを含みます。ラベル情報。
(2) getElementsByTagName タグによって返されたオブジェクトに基づいて、タグの種類 (type) の値がチェックボックスであるかどうかを判斷します。
(3) ラベルタイプtypeの値がチェックボックスの場合、ラベル內(nèi)のチェックボックスに値を代入します。 Checked の値が TRUE の場合は FALSE に代入し、Checked の値が FALSE の場合は TRUE に代入します。
<html>
<meta charset="utf-8"/>
<head>
</head>
<body>
<form method="post" name="form1" id="form1" action="">
<tr>
<td width="62" align="center"><input type="checkbox" name="conn_id_1" id="conn_id_1" value="1"/></td>
<td>東邪</td>
<td>PHP</td>
<td>部門經(jīng)理</td>
<td>29</td>
</tr>
<br/><br/>
<tr>
<td width="62" align="center"><input type="checkbox" name="conn_id_2" id="conn_id_2" value="1"/></td>
<td>西毒</td>
<td>JAVA</td>
<td>部門經(jīng)理</td>
<td>29</td>
</tr>
<br/><br/>
<tr>
<td width="62" align="center"><input type="checkbox" name="conn_id_3" id="conn_id_3" value="1"/></td>
<td>南帝</td>
<td>VB</td>
<td>部門經(jīng)理</td>
<td>29</td>
</tr>
<br/><br/>
<tr>
<td width="62" align="center"><input type="checkbox" name="conn_id_4" id="conn_id_4" value="1"/></td>
<td>北丐</td>
<td>ASP</td>
<td>部門經(jīng)理</td>
<td>29</td>
</tr>
<br/><br/>
<tr>
<input type="button" onclick="uncheckAll(form1,status)" value="不選">
<input type="button" onclick="checkAll(form1,status)" value="全選">
<input type="button" onclick="switchAll(form1,status)" value="反選">
</tr>
</form>
<script>
function uncheckAll(form1,status){ //不選
var elements = document.getElementsByTagName('input'); //獲取input標簽
for(var i=0;i<elements.length;i++){ //根據(jù)標簽的長度執(zhí)行循環(huán)
if(elements[i].type == 'checkbox'){ //判斷對象中元素的類型
if(elements[i].checked==true){ //判斷當checked的值為TURE時
elements[i].checked=false; //將checked賦值為FALSE
}
}
}
}
function checkAll(form1,status){ //全選
var elements = document.getElementsByTagName('input');
for(var i=0;i<elements.length;i++){
if(elements[i].type == 'checkbox'){
if(elements[i].checked==false){
elements[i].checked=true;
}
}
}
}
function switchAll(form1,status){ //反選
var elements = document.getElementsByTagName('input');
for(var i=0;i<elements.length;i++){
if(elements[i].type == 'checkbox'){
if(elements[i].checked==true){
elements[i].checked=false;
}else if(elements[i].checked==false){
elements[i].checked=true;
}
}
}
}
</script>
</body>
</html>
