<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="Generator" content="EditPlus®">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<title>Document</title>
<script type="text/javascript">
<!--
function checkAll( booleanValue){
var checkboxes= document.getElementsByName("hobby")
for(var i=0;i< checkboxes.length;i++){
checkboxes[i].checked = booleanValue;
}
}
function reverseCheck(){
var checkboxes= document.getElementsByName("hobby")
for(var i=0;i< checkboxes.length;i++){
checkboxes[i].checked = !checkboxes[i].checked;
}
}
//-->
</script>
</head>
<body>
<h1>請選擇你的愛好:</h1>
全選/全不選<input type="checkbox" name="hobbys" onclick="checkAll(this.checked)" /><br/>
<input type="checkbox" name="hobby" value="football" />足球
<input type="checkbox" name="hobby" value="basketball" />籃球
<input type="checkbox" name="hobby" value="swim" />游泳
<input type="checkbox" name="hobby" value="singing" />唱歌<br/>
<input type="button" value="全選" onclick="checkAll(true)"/>
<input type="button" value="全不選" onclick="checkAll(false)"/>
<input type="button" value="反選" onclick="reverseCheck()"/>
</body>
</html>
這行代碼是設置這個input 的onclick事件,調用的方法是checkAll,參數是當前input對象的checked屬性值。
this就是這個input元素,因為是checkbox類型,所以它有一個checked屬性,如果選中就是true,沒選中就是false.