复选框(checkbook)的全选和复选功能演示

[/color][color=red][size=xx-small][/size]<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>无标题文档</title>
<script language="javascript">

function   allcheck(){

      var check=document.getElementsByName("checkbox");
  for(var i=0;i<check.length;i++){
 
       check[i].checked=true;
  }


}
function  notallcheck(){

var check=document.getElementsByName("checkbox");
  for(var i=0;i<check.length;i++){
 
       check[i].checked=!check[i].checked;
  }

}
function  show(){

var s=""
var check=document.getElementsByName("checkbox");
  for(var i=0;i<check.length;i++){
 
  if(check[i].checked){
       s+=check[i].value;
   }
  }
  if(s.length==0){
  alert("没有选择!");
  }else{
  alert(s);
  }
   
}

</script>
</head>

<body>
<table width="300" border="1">
  <tr>
    <td height="61">你的爱好:</td>
  </tr>
  <tr>
    <td height="75"><input name="checkbox" type="checkbox" value="爬山" checked>
      爬山
      <input type="checkbox" name="checkbox" value="游泳">
      游泳
      <input type="checkbox" name="checkbox" value=" 打球 ">
      打球
      <input type="checkbox" name="checkbox" value="看电视">
      看电视</td>
  </tr>
  <tr>
    <td height="52"><input type="button" name="Submit" value="全选" onClick="allcheck()">   
      <input type="submit" name="Submit2" value="反选" onClick="notallcheck()">
    <input type="submit" name="Submit3" value="确定" onClick="show()"></td>
  </tr>
</table>
</body>
</html>

你可能感兴趣的:(html)