聚焦在一个表中的“行”，其中2行表示1集

Question

这里我举的例子https://jsfiddle.net/aj8asqz6/

<tr data-num="2"> 
     <td colspan="1">nrdsdrr</td> 
     <td colspan="4">eedasdee</td> 
    </tr> 
    <tr data-num="2"> 
     <td>dadsad</td> 
     <td>adsadad</td> 
     <td>ffdasdf</td> 
     <td>#dsadg</td> 
     <td>fdsad</td> 
    </tr> 

正如你可以看到每一个2行属于1个集从我的数据库的演示。当我点击tr时，我会用JS做某种动作。

问题是，用户可以忘记他点击了哪一个，因为表格没有改变。我不想只突出显示他点击的那一行，因为在每种情况下有2个相关的。

因此，例如，如果他点击最后一行，或者我的表格之前的行看起来像这样。

https://jsfiddle.net/aj8asqz6/1/

Answer 1

$('tr').click(function(){ 
 
    var parent = $(this).parent(); 
 
    var dataNum = $(this).attr('data-num'); 
 
    \t $(parent).find('[data-num="' + dataNum + '"]').addClass('active'); 
 
});

table { border-collapse: collapse;} 
 
td {border : 1px solid black;} 
 
.active {background-color: yellow; }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table> 
 
    <thead> 
 
     <tr data-num="1"> 
 
      <td colspan="1">Wup</td> 
 
      <td colspan="4">Wep</td> 
 
     </tr> 
 
     <tr data-num="1"> 
 
      <td>1</td> 
 
      <td>2</td> 
 
      <td>3</td> 
 
      <td>4</td> 
 
      <td>5</td> 
 
     </tr> 
 
    </thead> 
 
    <tbody> 
 
     <tr data-num="1"> 
 
      <td colspan="1">nrrr</td> 
 
      <td colspan="4">eeee</td> 
 
     </tr> 
 
     <tr data-num="1"> 
 
      <td>da</td> 
 
      <td>aad</td> 
 
      <td>fff</td> 
 
      <td>#g</td> 
 
      <td>fd</td> 
 
     </tr> 
 
     <tr data-num="2"> 
 
      <td colspan="1">nrdsdrr</td> 
 
      <td colspan="4">eedasdee</td> 
 
     </tr> 
 
     <tr data-num="2"> 
 
      <td>dadsad</td> 
 
      <td>adsadad</td> 
 
      <td>ffdasdf</td> 
 
      <td>#dsadg</td> 
 
      <td>fdsad</td> 
 
     </tr> 
 
    </tbody> 
 
</table>