这是我的示例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/
最佳答案
$('tr').click(function(){
var parent = $(this).parent();
var dataNum = $(this).attr('data-num');
$(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>
关于javascript - 关注表中的“行”,其中2行代表1个数据集,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/33517338/