如何动态改变表格中某一行的颜色

<html>
    <head>    <title> List</title>
    </head>
    <body >
    
  <form name="form1" Method="POST" action="">
  <div align="center"> </td> </tr> 
    
        <table width="100%" border="1" cellpadding="0" cellspacing="1" bordercolor="#FFFFFF" bgcolor="#000000">
        <tr>
        <td height="27" bgcolor="#6699CC">
        <div align="center"></div></td>
        </tr>
        </table>
        <table  width="100%" border="0" cellspacing="1" borderColorLight="#0000cc" borderColorDark="#ffffff" bgcolor="#000000" class="main">
        <tr bgcolor="#E8E8E8"> 
        <td height="26" colspan="3"> 
        <div align="center"></div></td>
        
        <tr bgcolor="#DFDFFF"> 
        <td width="11%" height="22"> 
        <p align="center">select 
        </td>
        <td width="11%"> <p align="center">
        <label  style='cursor:hand' onClick="OrderBy('GroupID');">
        Group ID</label></p></td>        <td width="18%"> <p align="center"> 
            <label  style='cursor:hand' onClick="OrderBy('GroupName');"> 
            Group Name</label>
          </p></td>
        
                <tr name="tr01" id="tr01" bgcolor="#ffffff"> 
                <td height="22">
                <div align="center"> 
                <input type="checkbox" name="0" id="0" value="001" checked  onclick='this.parentNode.parentNode.parentNode.bgColor=(this.checked)?"#FFFFFF":"#E8E8E8"'>
                </div>
                <td><div align="center"> 001</div>
                <td><div align="center">Common</div></td>
                </tr>
                
                <tr name="tr11" bgcolor="#efefef"> 
                <td height="22">
                <div align="center"> 
                <input type="checkbox" name="1" value="002"  onclick='this.parentNode.parentNode.parentNode.bgColor=(this.checked)?"#FFFFFF":"#E8E8E8"'>
                </div>
                <td><div align="center"> 002</div>
                <td><div align="center">344</div></td>
                </tr>
                
                <tr name="tr21" bgcolor="#efefef"> 
                <td height="22">
                <div align="center"> 
                <input type="checkbox" name="2" value="003"  onclick='this.parentNode.parentNode.parentNode.bgColor=(this.checked)?"#FFFFFF":"#E8E8E8"'>
                </div>
                <td><div align="center"> 003</div>
                <td><div align="center">34</div></td>
                </tr>
                
                <tr name="tr31" bgcolor="#efefef"> 
                <td height="22">
                <div align="center"> 
                <input type="checkbox" name="3" value="004" onclick='this.parentNode.parentNode.parentNode.bgColor=(this.checked)?"#FFFFFF":"#E8E8E8"'>
                </div>
                <td><div align="center"> 004</div>
                <td><div align="center">group2</div></td>
                </tr>
                
                <tr name="tr41" bgcolor="#efefef"> 
                <td height="22">
                <div align="center"> 
                <input type="checkbox" name="4" value="006" onclick='this.parentNode.parentNode.parentNode.bgColor=(this.checked)?"#FFFFFF":"#E8E8E8"'>
                </div>
                <td><div align="center"> 006</div>
                <td><div align="center">group1</div></td>
                </tr>
                
                <tr name="tr51" bgcolor="#efefef"> 
                <td height="22">
                <div align="center"> 
                <input type="checkbox" name="5" value="007"  onclick='this.parentNode.parentNode.parentNode.bgColor=(this.checked)?"#FFFFFF":"#E8E8E8"'>
                </div>
                <td><div align="center"> 007</div>
                <td><div align="center">group11</div></td>
                </tr>
                
                <tr name="tr61" bgcolor="#efefef"> 
                <td height="22">
                <div align="center"> 
                <input type="checkbox" name="6" value="008" onclick='this.parentNode.parentNode.parentNode.bgColor=(this.checked)?"#FFFFFF":"#E8E8E8"'>
                </div>
                <td><div align="center"> 008</div>
                <td><div align="center">group123</div></td>
                </tr>
                
        </table>    
        
    </div>  
   </table>
    <div align="center"> 
    <p> 
    <input type="submit" name="Submit" value="  Submit ">
    <br>
    <br>
    </p>
    </div>
    </form>    </body>
    </html>

解决方案 »

  1.   

    xinyunyishui(心云意水) 不是已经实现了么
      

  2.   

    <html>
        <head>    <title> List</title>
        
        <script language="JavaScript">    </script>
        </head>
        <body >
        
      <form name="form1" Method="POST" action="">
      <div align="center"> </td> </tr> 
        
            <table width="100%" border="1" cellpadding="0" cellspacing="1" bordercolor="#FFFFFF" bgcolor="#000000">
            <tr>
            <td height="27" bgcolor="#6699CC">
            <div align="center"></div></td>
            </tr>
            </table>
            
        <table  width="100%" border="0" cellspacing="1" borderColorLight="#0000cc" borderColorDark="#ffffff" bgcolor="#000000" class="main">
          <tr bgcolor="#E8E8E8"> 
            <td height="26" colspan="3"> 
            <div align="center"></div></td>
            
            <tr bgcolor="#DFDFFF"> 
            <td width="11%" height="22"> 
            <p align="center">select 
            </td>
            <td width="11%"> <p align="center">
            <label  style='cursor:hand' onClick="OrderBy('GroupID');">
            Group ID</label></p></td>        <td width="18%"> <p align="center"> 
                <label  style='cursor:hand' onClick="OrderBy('GroupName');"> 
                Group Name</label>
              </p></td>
            
                    
          <tr name="tr01" id="tr01" bgcolor="#efefef"> 
            <td height="22"> 
              <div align="center"> 
                    <input type="checkbox" name="0" id="0" value="001"  onClick="javascript:if (this.checked){this.parentNode.parentNode.parentNode.bgColor='#ffffff'};else{this.parentNode.parentNode.parentNode.bgColor='#efefef'}">
                    </div>
                    
            <td> 
              <div align="center"> 001</div>
                    
            <td> 
              <div align="center">Common</div></td>
                    </tr>
                    
                    <tr name="tr11" bgcolor="#efefef"> 
                    <td height="22">
                    <div align="center"> 
                    <input type="checkbox" name="1" value="002" onClick="javascript:if (this.checked){this.parentNode.parentNode.parentNode.bgColor='#ffffff'};else{this.parentNode.parentNode.parentNode.bgColor='#efefef'}">
                    </div>
                    <td><div align="center"> 002</div>
                    <td><div align="center">344</div></td>
                    </tr>
                    
                    <tr name="tr21" bgcolor="#efefef"> 
                    <td height="22">
                    <div align="center"> 
                <input type="checkbox" name="12" value="003" onClick="javascript:if (this.checked){this.parentNode.parentNode.parentNode.bgColor='#ffffff'};else{this.parentNode.parentNode.parentNode.bgColor='#efefef'}">
              </div>
                    <td><div align="center"> 003</div>
                    <td><div align="center">34</div></td>
                    </tr>
                    
                    <tr name="tr31" bgcolor="#efefef"> 
                    <td height="22">
                    <div align="center"> 
                <input type="checkbox" name="13" value="004" onClick="javascript:if (this.checked){this.parentNode.parentNode.parentNode.bgColor='#ffffff'};else{this.parentNode.parentNode.parentNode.bgColor='#efefef'}">
              </div>
                    <td><div align="center"> 004</div>
                    <td><div align="center">group2</div></td>
                    </tr>
                    
                    <tr name="tr41" bgcolor="#efefef"> 
                    <td height="22">
                    <div align="center"> 
                <input type="checkbox" name="14" value="005" onClick="javascript:if (this.checked){this.parentNode.parentNode.parentNode.bgColor='#ffffff'};else{this.parentNode.parentNode.parentNode.bgColor='#efefef'}">
              </div>
                    <td><div align="center"> 006</div>
                    <td><div align="center">group1</div></td>
                    </tr>
                    
                    <tr name="tr51" bgcolor="#efefef"> 
                    
            <td height="22"> 
              <div align="center"> 
                <input type="checkbox" name="15" value="006" onClick="javascript:if (this.checked){this.parentNode.parentNode.parentNode.bgColor='#ffffff'};else{this.parentNode.parentNode.parentNode.bgColor='#efefef'}">
              </div>
                    
            <td> 
              <div align="center"> 007</div>
                    
            <td> 
              <div align="center">group11</div></td>
                    </tr>
                    
                    <tr name="tr61" bgcolor="#efefef"> 
                    <td height="22">
                    <div align="center"> 
                <input type="checkbox" name="16" value="007" onClick="javascript:if (this.checked){this.parentNode.parentNode.parentNode.bgColor='#ffffff'};else{this.parentNode.parentNode.parentNode.bgColor='#efefef'}">
              </div>
                    <td><div align="center"> 008</div>
                    <td><div align="center">group123</div></td>
                    </tr>
                    
            </table>    
            
        </div>  
       </table>
        <div align="center"> 
        <p> 
        <input type="submit" name="Submit" value="  Submit ">
        <br>
        <br>
        </p>
        </div>
        </form>    </body>
        </html>
      

  3.   

    <table>
    <tr onclick="this.style.background= ? this.style.background=='red' 'white' : 'red';"><td></td></tr>
    </table>
      

  4.   

    <form name= "form1234">
    <script>
    function choiceColor(objChk,objTr){
      if(objChk.checked == true) {
        objTr.style.background = 'red';
      }else{
       objTr.style.background ='';
      }  
    }
    </script><table width="408" border=1 style="BORDER-COLLAPSE: collapse">
      <tr onClick="choiceColor(check1,this)">
        <td><input type="checkbox" name="check1"></td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
      </tr>
      <tr onClick="choiceColor(check2,this)">
        <td><input type="checkbox" name="check2"></td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
      </tr>
      <tr onClick="choiceColor(check3,this)">
        <td><input type="checkbox" name="check3"></td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
      </tr>
      <tr onClick="choiceColor(check4,this)">
        <td><input type="checkbox" name="check4"></td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
      </tr>
      <tr onClick="choiceColor(check5,this)">
        <td><input type="checkbox" name="check5"></td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
      </tr>
    </table></form>