大家给看看有没有办法？

页面中5个复选框，现在因为点击单表格的每行行有设置 复选框的选择为相反状态。所以现在点表格中的复选框不起作用。大家给想想办法？ 下面是整个页面。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-
Type" content="text/html; charset=gb2312" />
<title>js测试</title>
<script language="javascript">
function ckOrNot(j){ var objs = document.getElementsByName('ck'); 
for(i=0;i<objs.length;i++) { 
if(objs[i].type=='checkbox') { 
if(i==j){
if(objs[i].checked) { 
objs[i].checked =false; 
} else { 
objs[i].checked =true; 
} 
} } 

}
}</script></head><body>
<form id="ckform" name="ckform" method="post" action="">
<table width="80%" height="212" border="0" align="center" cellpadding="0" cellspacing="0">
  <tr onClick="return ckOrNot(0)">
    <td align="center" bgcolor="#0000FF"><input name="ck" type="checkbox" id="ck" value="1" /></td>
    <td align="center" bgcolor="#0000FF">&nbsp;</td>
    <td align="center" bgcolor="#0000FF">&nbsp;</td>
    <td align="center" bgcolor="#0000FF">&nbsp;</td>
    <td align="center" bgcolor="#0000FF">&nbsp;</td>
  </tr>
  <tr onClick="return ckOrNot(1)">
    <td align="center" bgcolor="#009933"><input name="ck" type="checkbox" id="ck" value="2" /></td>
    <td align="center" bgcolor="#009933">&nbsp;</td>
    <td align="center" bgcolor="#009933">&nbsp;</td>
    <td align="center" bgcolor="#009933">&nbsp;</td>
    <td align="center" bgcolor="#009933">&nbsp;</td>
  </tr>
  <tr onClick="return ckOrNot(2)">
    <td align="center" bgcolor="#FF0000"><input name="ck" type="checkbox" id="ck" value="3" /></td>
    <td align="center" bgcolor="#FF0000">&nbsp;</td>
    <td align="center" bgcolor="#FF0000">&nbsp;</td>
    <td align="center" bgcolor="#FF0000">&nbsp;</td>
    <td align="center" bgcolor="#FF0000">&nbsp;</td>
  </tr>
  <tr onClick="return ckOrNot(3)">
    <td align="center" bgcolor="#000000"><input name="ck" type="checkbox" id="ck" value="4" /></td>
    <td align="center" bgcolor="#000000">&nbsp;</td>
    <td align="center" bgcolor="#000000">&nbsp;</td>
    <td align="center" bgcolor="#000000">&nbsp;</td>
    <td align="center" bgcolor="#000000">&nbsp;</td>
  </tr>
  <tr onClick="return ckOrNot(4)">
    <td align="center" bgcolor="#FF6600"><input name="ck" type="checkbox" id="ck" value="5" /></td>
    <td align="center" bgcolor="#FF6600">&nbsp;</td>
    <td align="center" bgcolor="#FF6600">&nbsp;</td>
    <td align="center" bgcolor="#FF6600">&nbsp;</td>
    <td align="center" bgcolor="#FF6600">&nbsp;</td>
  </tr>
</table>
</form>
</body>
</html>

解决方案 »

  1.   


    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-
    Type" content="text/html; charset=gb2312" />
    <title>js测试</title>
    <script language="javascript">
    function ckOrNot(j){
    var objs = document.getElementsByName('ck'); 
    for(i=0;i<objs.length;i++) { 
    if(objs[i].type=='checkbox') { 
    if(i==j){
    objs[i].checked = !objs[i].checked;
    }
    } 
    }
    }
    window.onload = function(){
    var objs = document.getElementsByName("ck");
    for (var i = 0; i < objs.length; i++){
    objs[i].onclick = function(){
    this.checked = !this.checked;
    if(window.event) {
    window.event.cancelBubble = true;
    } else{
    event.stopPropagation();
    }
    };
    }
    };
    </script></head><body>
    <form id="ckform" name="ckform" method="post" action="">
    <table width="80%" height="212" border="0" align="center" cellpadding="0" cellspacing="0">
      <tr onClick="ckOrNot(0)">
      <td align="center" bgcolor="#0000FF"><input name="ck" type="checkbox" id="ck" value="1" /></td>
      <td align="center" bgcolor="#0000FF">&nbsp;</td>
      <td align="center" bgcolor="#0000FF">&nbsp;</td>
      <td align="center" bgcolor="#0000FF">&nbsp;</td>
      <td align="center" bgcolor="#0000FF">&nbsp;</td>
      </tr>
      <tr onClick="ckOrNot(1)">
      <td align="center" bgcolor="#009933"><input name="ck" type="checkbox" id="ck" value="2" /></td>
      <td align="center" bgcolor="#009933">&nbsp;</td>
      <td align="center" bgcolor="#009933">&nbsp;</td>
      <td align="center" bgcolor="#009933">&nbsp;</td>
      <td align="center" bgcolor="#009933">&nbsp;</td>
      </tr>
      <tr onClick="ckOrNot(2)">
      <td align="center" bgcolor="#FF0000"><input name="ck" type="checkbox" id="ck" value="3" /></td>
      <td align="center" bgcolor="#FF0000">&nbsp;</td>
      <td align="center" bgcolor="#FF0000">&nbsp;</td>
      <td align="center" bgcolor="#FF0000">&nbsp;</td>
      <td align="center" bgcolor="#FF0000">&nbsp;</td>
      </tr>
      <tr onClick="ckOrNot(3)">
      <td align="center" bgcolor="#000000"><input name="ck" type="checkbox" id="ck" value="4" /></td>
      <td align="center" bgcolor="#000000">&nbsp;</td>
      <td align="center" bgcolor="#000000">&nbsp;</td>
      <td align="center" bgcolor="#000000">&nbsp;</td>
      <td align="center" bgcolor="#000000">&nbsp;</td>
      </tr>
      <tr onClick="ckOrNot(4)">
      <td align="center" bgcolor="#FF6600"><input name="ck" type="checkbox" id="ck" value="5" /></td>
      <td align="center" bgcolor="#FF6600">&nbsp;</td>
      <td align="center" bgcolor="#FF6600">&nbsp;</td>
      <td align="center" bgcolor="#FF6600">&nbsp;</td>
      <td align="center" bgcolor="#FF6600">&nbsp;</td>
      </tr>
    </table>
    </form>
    </body>
    </html>
      

  2.   

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-
    Type" content="text/html; charset=gb2312" />
    <title>js测试</title>
    <script language="javascript">
    function ckOrNot(j){
        var objs = document.getElementsByName('ck'); 
        for(i=0;i<objs.length;i++) { 
            if(objs[i].type=='checkbox') { 
                if(i==j){
                    objs[i].checked = !objs[i].checked;
                }
            } 
        }
    }
    window.onload = function(){
        var objs = document.getElementsByName("ck");
        for (var i = 0; i < objs.length; i++){
            objs[i].onclick = function(){
                
                if(window.event) {
                    window.event.cancelBubble = true;
                } else{
    this.checked = !this.checked;
                    event.stopPropagation();
                }
            };
        }
    };
    </script></head><body>
    <form id="ckform" name="ckform" method="post" action="">
    <table width="80%" height="212" border="0" align="center" cellpadding="0" cellspacing="0">
      <tr onClick="ckOrNot(0)">
      <td align="center" bgcolor="#0000FF"><input name="ck" type="checkbox" id="ck" value="1" /></td>
      <td align="center" bgcolor="#0000FF">&nbsp;</td>
      <td align="center" bgcolor="#0000FF">&nbsp;</td>
      <td align="center" bgcolor="#0000FF">&nbsp;</td>
      <td align="center" bgcolor="#0000FF">&nbsp;</td>
      </tr>
      <tr onClick="ckOrNot(1)">
      <td align="center" bgcolor="#009933"><input name="ck" type="checkbox" id="ck" value="2" /></td>
      <td align="center" bgcolor="#009933">&nbsp;</td>
      <td align="center" bgcolor="#009933">&nbsp;</td>
      <td align="center" bgcolor="#009933">&nbsp;</td>
      <td align="center" bgcolor="#009933">&nbsp;</td>
      </tr>
      <tr onClick="ckOrNot(2)">
      <td align="center" bgcolor="#FF0000"><input name="ck" type="checkbox" id="ck" value="3" /></td>
      <td align="center" bgcolor="#FF0000">&nbsp;</td>
      <td align="center" bgcolor="#FF0000">&nbsp;</td>
      <td align="center" bgcolor="#FF0000">&nbsp;</td>
      <td align="center" bgcolor="#FF0000">&nbsp;</td>
      </tr>
      <tr onClick="ckOrNot(3)">
      <td align="center" bgcolor="#000000"><input name="ck" type="checkbox" id="ck" value="4" /></td>
      <td align="center" bgcolor="#000000">&nbsp;</td>
      <td align="center" bgcolor="#000000">&nbsp;</td>
      <td align="center" bgcolor="#000000">&nbsp;</td>
      <td align="center" bgcolor="#000000">&nbsp;</td>
      </tr>
      <tr onClick="ckOrNot(4)">
      <td align="center" bgcolor="#FF6600"><input name="ck" type="checkbox" id="ck" value="5" /></td>
      <td align="center" bgcolor="#FF6600">&nbsp;</td>
      <td align="center" bgcolor="#FF6600">&nbsp;</td>
      <td align="center" bgcolor="#FF6600">&nbsp;</td>
      <td align="center" bgcolor="#FF6600">&nbsp;</td>
      </tr>
    </table>
    </form>
    </body>
    </html>