Question

我有一个从db表动态填充的html表'TemplateData'...例如，最终可能会像：

ID  Name  Age
1   John  23
2   Mick  27
3   Mark  29

当用户点击屏幕上的图像时，它将回发相应的ID值。从这里我想改变关联行的背景颜色。

所以例如'''已经贴回'fid'。所以我试过......

function highlightRowInTable(fid) {
    var dtable = $("#TemplateData");
    dtable.addClass("highlightedRow");
    }

然而，这突出了桌子的外部细胞。我只想突出显示相应的行。

我一直在和父母和兄弟姐妹搞谈，但是找不到任何有效的例子......有什么想法吗？

Answer 1

看起来您的代码正在选择整个表格，然后对其应用一个类，尽管很难肯定。如果您的表附加了一个事件监听器，您应该能够获取被单击的子元素并切换其类。

document
  .getElementById('table')
  .addEventListener('click', function(event){
    // now event refers to the part of the dom that was clicked on
    console.log(event)
  });

虽然我不确定没看你的代码。如果你已经设置了监听器，你可能需要根据fid为每一行提供一个id，这样你的函数就可以指定要添加类的id。

function highlightRowInTable(fid) {
    $(fid).addClass("highlightedRow");
}

Answer 2

创建表格时，您可以向<tr>添加属性，以便稍后在点击图片时选择该属性。

@foreach (var row in table)
{
   <tr data-uid="@row[id]">
       <td></td>
   </tr>
}

function highlightRowInTable(fid) {
    var rows = $('tr').filter('[data-uid="' + fid + '"]');
    rows.addClass("highlightedRow");
}

仅突出显示表中具有相应ID值的行

2 个答案: