1

我有一张这样的桌子：

分期付款表

当我单击它们时，我想用价格更改单元格的背景颜色（例如addClass(on)），如左下角所见，并且也更改其他单元格的背景颜色（例如addClass(off)）。

我不希望其他单元格受到影响（带有文本和不同颜色的单元格）。

我还需要获取单击的单元格所属行的 id。

这是一行的结构。

<tr class="taksit" id="tek">
    <td><b>Tek Çekim</b></td>
    <td><?=$sontutar?> TL</td>
    <td><?=$sontutar?> TL</td>
    <td><?=$sontutar?> TL</td>
    <td><?=$sontutar?> TL</td>
    <td><?=$sontutar?> TL</td>
    <td><?=$sontutar?> TL</td>
    <td><?=$sontutar?> TL</td>
</tr>

我尝试了一些在这里找到的技巧，但无法做到。知道我该怎么做吗？

4

2 回答 2

1 
$('table#uniqueID tbody td').on('click',function() {
    $(this).closest('tbody').find('td').removeClass('highlight');
    $(this).addClass('highlight');
});
于 2012-12-11T19:51:28.710 回答
1 
$("#table_selector td.clickable").on('click',function(){
  // cache $(this)
  var clickedElement = $(this);

  // remove background color from other clickable items 
  $("td.clickable").css('background','none');

  // change the background color of the clicked <td>    
  clickedElement.css('background','red');

  var rowId = clickedElement.closest('tr').attr('id');
});

让我稍微解释一下我在这里所做的事情。
首先，您说您不希望每个<td>人都受到这些点击和背景变化的影响。所以你应该给所有<td>“可点击”的 's 一个类，然后你可以将你的on('click')事件限制为你想要的元素。您当然也可以做相反的事情，将“noClick”类添加到您想要忽略的类中......

<td>可以通过几种方式更改背景颜色，为了示例，我选择使用 simple .css('background','red');，但我相信您的实际代码中有更多逻辑。

通过使用该函数查找rowId最近的父元素来提取。然后简单的看属性。<tr>closest()id

于 2012-12-11T19:55:30.387 回答