怎么实现当一个复选框选中后，它所在的表的那一行改变背景颜色？

如题！
就是说当复选框被选中时，它所在的行改变颜色，当复选框取消选中时，所在行的颜色恢复正常！类似网易邮箱选中邮件时的效果！谢谢各位！




  <table>   

      <tr>

      	<td width="311">   

          <INPUT  type="checkbox"  id=checkbox1   name=checkbox1  onclick="">asfdsaf   

      </td>

  

      </tr>   

      <tr>

          <td>   

              <INPUT type="checkbox"  id=checkbox2   name=checkbox2  onclick="">234   

          </td>

      </tr>   

  </table>

8 个解决方案

#1

举例



<script>


</script>

  <table>   

      <tr>

          <td width="311">   

          <INPUT  type="checkbox"  id=checkbox1   name=checkbox1  onclick="this.parentElement.parentElement.style.backgroundColor=this.checked?'red':''">asfdsaf   

      </td>

  

      </tr>   

      <tr>

          <td>   

              <INPUT type="checkbox"  id=checkbox2   name=checkbox2  onclick="this.parentElement.parentElement.style.backgroundColor=this.checked?'red':''">234   

          </td>

      </tr>   

  </table>

#2

在列中加个ID，
if(checked) {
document.getElementById("td_id").becolor = "red";
}

#3

bgcolor

#4



<table>   

  <tr>

    <td width="311">   

      <INPUT  type="checkbox"  id=checkbox1   name=checkbox1 onclick="this.parentNode.parentNode.style.backgroundColor=this.checked?'#eeeeee':'#ffffff'">asfdsaf   

    </td>

  

  </tr>   

  <tr>

    <td>   

      <INPUT type="checkbox"  id=checkbox2   name=checkbox2  onclick="this.parentNode.parentNode.style.backgroundColor=this.checked?'#eeeeee':'#ffffff'"

    </td>

  </tr>   

</table>

#5

parentElement.parentElement.style.backgroundColor

#6

简单实现选中变色，取消选中恢复白色，已经测试通过



onclick="changeColor(this);"

input的onclick事件中添加以上代码，末尾加上



<script>

function changeColor(obj) {

var f = obj.checked;

var chkColor = "#ff00ff"; //选中后颜色

var noColor = "#fff";  //取消选中后的颜色

if(f)

obj.parentElement.parentElement.style.backgroundColor = chkColor;

else

obj.parentElement.parentElement.style.backgroundColor = noColor;

}

</script>

#7

sdfgdfgdfgdfgdfgdfg

#8

#1

举例



<script>


</script>

  <table>   

      <tr>

          <td width="311">   

          <INPUT  type="checkbox"  id=checkbox1   name=checkbox1  onclick="this.parentElement.parentElement.style.backgroundColor=this.checked?'red':''">asfdsaf   

      </td>

  

      </tr>   

      <tr>

          <td>   

              <INPUT type="checkbox"  id=checkbox2   name=checkbox2  onclick="this.parentElement.parentElement.style.backgroundColor=this.checked?'red':''">234   

          </td>

      </tr>   

  </table>

#2