专注于“;行“;其中2行表示1个数据集

Focus on a "row" in a table where 2 rows represent 1 dataset

本文关键字：表示 1个 数据集 2行 专注 其中      更新时间：2023-09-26

下面是我的示例演示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>

相关文章：