JQUERY复选框反选时背景色问题

Question

当选中某个checkbox，该元素所在的行背景色加深。取消选中时，所在行背景色变白。全选和取消全选都可以了，就是部分选择然后反选时有点问题，估计是本人JQUERY水平差所致。直接看代码吧
$("#fanxuan").click(function(){
    $("input[type=checkbox]").each(function(){   
    if(this.checked){   
        this.checked = false;   
        $(this).parents("tr").style.backgroundColor="#ffffff";
    }else{   
        this.checked = true;   
        $(this).parents("tr").style.backgroundColor="#D3E6F8";
     }
    });
});
大概意思是遍历所有checkbox，然后取反。到这里功能正常，但是$(this).parents("tr").style.backgroundColor="#ffffff";和$(this).parents("tr").style.backgroundColor="#D3E6F8";就出现问题了，背景色却不会跟着变化。请问，是哪里写的不对呢？

Answer 1

改成以下：            $(document).ready(function(){
                $("#fanxuan").bind('click',function(){
                  $("input[type=checkbox]").each(function(){   
                      if(this.checked){   
                        this.checked = false;   
                        $(this).parents("td")[0].parentNode.style.backgroundColor="#ffffff";
                      }
                      else{   
                        this.checked = true;   
                        $(this).parents("td")[0].parentNode.style.backgroundColor="#D3E6F8";
                      }
                  });
                })
            });

Answer 2

<tbody id="tbody">
        <s:iterator value="pageDataList" status="status"> 
  <tr onmouseover="$(this).addClass('mouse_over');" onmouseout="$(this).removeClass('mouse_over');">
<td nowrap><input type="checkbox" id="${ID}" value="${ID}" name="checkname"/>${status.count}</td>
<td>${QYMC}</td>
<td>${QYDQCODE}</td>
<td nowrap>${QYSSHY}</td>
<td nowrap>${UPDATETIME}</td>
<td nowrap>${UPDATEUSER}</td>
<app:ckact item="xxxx">
  <td nowrap>
   <a href="${ctx}/qy/qypreview?id=${ID}" target="_cg">预览</a> 
    <a href="${ctx}/qy/showqy?id=${ID}">修改</a>
  </td>
                </app:ckact>
  </tr>
</s:iterator>
     </tbody>

Answer 3

$(this).parents("tr").css("background-color","red");

Answer 4

可以了，不过不是很理解为什么td那个可以用parents（），我原先是2个parents（），不行。直接parents（“tr”）也是不行的。还有就是[0]是什么意思呢？难道parents（）返回的是数组？呵呵，我JQUERY新手，求指教啊，呵呵

Answer 5

奇怪了，用CSS的方法就可以啊，我用style的就不行了，太神奇了，呵呵

Answer 6

你对Jquery的更多的理解，以下是代码和代码
<table cellspacing="0" border="1">
<tr>
<td>
<input type="checkbox" />checkbox</td>
<td>Some text here</td>
<td>Extra text here</td>
</tr>
<tr>
<td>
<input type="checkbox" />checkbox</td>
<td>Some text here</td>
<td>Extra text here</td>
</tr>
</table>[/code
Javascript代码如下：
[code=JScript]$('table :checkbox').click(function () {
$(this).parent().parent().css('background',$(this).attr('checked')? 'red':'blue');
});
如果其他行还有checkbox，那么使用更强力的选择器就好

Answer 7

补充上楼：如果该列只有第一列有checkbox并想以此控制其所在tr的背景颜色，就为$('table :checkbox')绑定click事件，以$(this).attr('checked')作为背景颜色依据；
如果此checkbox在其他列出现、或者此checkbox嵌套了多层Dom，那么你的选择器就需要更加准确，仅此而已。

Answer 8

大爷  style是dom对象 $(this).parents("tr")这个是jq对象 $(this).parents("tr")[0]这样才是dom对象