jquery - 如何在 mvc razor 中显示/隐藏网格行

Question

在我的 View 中，我有一个表，它为输出中的每条记录创建两行，如下所示:

<table ......>
@foreach(var obj in Model)
{
 <tr>
   <td class="toggle-class" onclick="toggle(this);">
   <td>more columns</td>
 </tr>
 <tr id="additionalRows" style="display:none;">
    <td> stuff  </td>
    <td> more stuff  </td>
 </tr>
}
</table>

我想要做的是当单击第一行的图像时显示或隐藏该记录的第二行。

我该怎么做？

Answer 1

这样就可以了:

$(".toggle-class").click(function(){
    $(this).parent().next("tr").show();
});

或者如果你想切换的话:

$(".toggle-class").click(function(){
    $(this).parent().next("tr").toggle();
});

这是JSFiddle Example