我有从视图动态生成的下表。我需要添加点击事件class=heading
来显示或隐藏class=content
。
<table>
<thead>
<tr>
<th class="thead">Function</th>
<th class="thead"">Type</th>
@foreach (var item in Model.PackageNames)
{
<th class="thead">
@item
</th>
}
</tr>
</thead>
<tbody>
@foreach (var item in Model.PrivilegeGroups)
{
<tr>
<td colspan="50">
<div class="heading">
@item.Name
</div>
</td>
</tr>
<text>
<p class="content">
@foreach (var privilege in item.Privileges.Values)
{
<tr>
<td>
@privilege.Name
</td>
<td>
@privilege.Type.ToString()
</td>
@foreach (var package in privilege.Packages)
{
<td>
@package.AccessLevel.ToString()
</td>
}
</tr>
}
</p>
</text>
}
</tbody>
</table>
这是我正在使用的 jQuery,但它不起作用。
<script type="text/javascript">
$(document).ready(function () {
$(".heading").click(function () {
$(this).next(".content").slideToggle(500);
});
}); // -- End Ready
</script>
但是,$('.content').slideToggle();
确实有效并使用 切换所有元素class=content
。我只想隐藏下一个元素。我如何使它工作?
谢谢。