Question

让我们说这是我的表：

<table>
  <tr>
    <td>a</td>
    <td>one</td>
    <td>two</td>
  </tr>
  <tr>
    <td>b</td>
    <td>three</td>
    <td>four</td>
  </tr>
  <tr>
    <td>c</td>
    <td>five</td>
    <td>six</td>
<table>

使用Javascript，我希望能够切换我点击的行之下的行的display: none元素...但只有当我点击每行中的第一个单元格时才会这样。

例如，如果我点击包含a的单元格，则tr包含单元格b，three和four以及{{ 1}}包含单元格tr，c和five在我再次点击之前不会显示。但是，点击six或one将无法执行任何操作。

我将要使用此代码的表格要大得多。

Answer 1

使用jQuery，它非常简单：

$("table tr td:first-child").click(function() {
    $(this).parent().nextAll().toggle();
});

如果我找到答案，我会用简单的JavaScript答案更新我的答案。

Answer 2

使用jQuery：

jQuery('table').find('tr').find('td:first').click(function() {
    jQuery(this).parent().next().toggle();
});

http://jsfiddle.net/

在表格中切换tr显示

2 个答案: