Question

我被困住了，我无法使用变量和jquery来计算孩子的数量。我做了什么：

<ul>
    <li>First</li>
    <li>Second</li>
    <li>Third</li>
</ul>

和

<table>
  <tr>
    <th></th>
    <th></th>
    <th></th>
    <th></th>
  </tr>
  <tr>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
  </tr>
  <tr>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
  </tr>
</table>

我想从列表中单击一个特定的子节点，并在表格的同一行中更改了类。

类似的东西：

$('ul li:nth-child(' + count + ')').click(function() {
    $('table tr:nth-child(' + count + ')').addClass('active');
});

但我不知道如何正确使用变量＆＃39; count＆＃39;。

Answer 1

您可以使用$.fn.index获取LI的当前索引并使用它来突出显示相应的表行：

$('ul li').click(function() {
    $('table tr:eq(' + $(this).index() + ')').addClass('active');
});

使用nth-child，您需要添加+1：'table tr:nth-child(' + ($(this).index() + 1) + ')'。

Answer 2

点击li首先删除活动类和addClass，然后单击

动态

$('ul li').click(function() {
    $('.active').removeClass('active');
    $('table tr:eq(' + $(this).index() + ')').addClass('active');
});

Demo

元素nth-child中的变量使用jquery

2 个答案: