Question

在我的视图中，我有一个表，为输出中的每个记录创建两行，如下所示：

<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

这样的事情会起作用吗？

<script>
$(function(){
$("table tr.toggleClass img").click(function(){
$(this).parent().next("tr").toggle();
}):
});
</script>

Answer 2

这样做：

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

或者如果您想要切换：

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

以下是 JSFiddle Example

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

2 个答案: