点击Html页面中Table上的tr 实现Tr前的checkbox选中或取消

使用Js 简单实现tr点击 tr前的checkbox选中或取消


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
  <title> New Document </title>
  <meta name="Generator" content="EditPlus">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
 </head>
<SCRIPT LANGUAGE="javascript">
<!--
function bgChange(obj){
obj.all.id.checked=(obj.all.id.checked==true?false:true); //复选框状态第二转变,即为正常状态  其all.id 中的id为checkbox的name
}

//-->
</SCRIPT>
 <body>
<FORM METHOD=POST NAME="form" action="del.asp">
<table width="998" border="0" cellspacing="0" cellpadding="0">
<tr>
    <td><div align="center">多选</div></td>
    <td><div align="center">内容</div></td>
    
</tr>

<tr onmouseover="this.style.background='#E5ECF2'"; onclick="bgChange(this)">
    <td><div align="center"><input type="checkbox" name="id" value="1"></div></td>
    <td>信息一</td>  
</tr>
<tr onmouseover="this.style.background='#E5ECF2'"; onclick="bgChange(this)">
    <td><div align="center"><input type="checkbox" name="id" value="1"></div></td>
    <td>信息二</td>  
</tr>

<tr onmouseover="this.style.background='#E5ECF2'"; onclick="bgChange(this)">
    <td><div align="center"><input type="checkbox" name="id" value="1"></div></td>
    <td>信息三</td>  
</tr>


</table>


</FORM>




  
 </body>
</html>



你可能感兴趣的:(checkbox)