Question

我想在点击上方的行后展开隐藏行

$(".main").click(function () {
  $(this).next("tr").show();
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<tr class="row100 body main">
  <td class="cell100 column1" >39</td>
  <td class="cell100 column2" s>900,000</td>
</tr>
<tr class="row100 body sub" style="display:none;">  
  <td class="cell100 column1" >exa</td>
  <td class="cell100 column2" >lura</td>
</tr>

Answer 1

<tr>

<tr>元素用于将<th>或<td>值组合在一起，成为表标题或数据的一行价值观。 <tr>元素可以是元素的直接子元素，也可以嵌套在父元素<thead>，<tfoot>或<tbody>元素中。

将<tr>放在<table>内：

$(".main").click(function () {
  $(this).next("tr").show();
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<table>
  <tr class="row100 body main">
    <td class="cell100 column1" >39</td>
    <td class="cell100 column2" s>900,000</td>
  </tr>
  <tr class="row100 body sub" style="display:none;">  
    <td class="cell100 column1" >exa</td>
    <td class="cell100 column2" >lura</td>
  </tr>
</table>

Answer 2

您没有表格标签，可以使用它

$(".main").click(function () {
    $(this).next('tr').show();
});

$(".main").click(function () {
    $(this).next('tr').show();
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
    <tr class="row100 body main">
     <td class="cell100 column1" >39</td>
     <td class="cell100 column2" s>900,000</td>
    </tr>
    <tr class="row100 body sub" style="display:none;">  
     <td class="cell100 column1" >exa</td>
     <td class="cell100 column2" >lura</td>
    </tr>
    
    </table>

展开表格隐藏表格行

2 个答案: