Question

我在每行的第一个单元格中有一个带单选按钮的表。

每次我点击按钮时，行的颜色都应该改变 - 它的作用。但我想要实现的是每次我点击另一个单选按钮时，第一个单元格的表格单元格的颜色应该恢复正常 - 所以只需单击按钮被单击的单元格。

$(".button-class").click(function(){
        $(this).closest("tr").find("td:first").css({"background-color":"#f00"});        
    });

这使细胞具有颜色。我怎么能“脱色”呢？谢谢！

Answer 1

最简单的方法是将“选定的”CSS类添加到您想要选择的行中：

$(".button-class").click(function(){ 
  $(".selected-class").removeClass("selected-class");
  $(this).closest("tr").find("td:first").addClass("selected-class");
});

以下是实际操作的示例：http://jsfiddle.net/LNBPq/这或多或少是您想要实现的目标吗？

Answer 2

<强> HTML

<table id="myTable">
<tr>
<td>
    <input name="myRadio" class="myRadio" type="radio" />
</td>
<td>
    my row 1
    </td>
</tr>
<tr>
 <td>
    <input name="myRadio" class="myRadio" type="radio" />
 </td>
 <td>
    my row 2
  </td>
 </tr> 
</table>

<强>的Javascript

jQuery('.myRadio').bind('change',function(e){
        jQuery('#myTable').find('tr').css('background-color','#fff');
    jQuery(e.target).parents('tr:first').css('background-color','yellow');
});

Demo

单击单选按钮后取消更改表格单元格的颜色

2 个答案: