我找到了一个jfiddle，通过单击文本折叠/展开行:
小提琴
HTML:
<table border="1">
<tr>
<td>Cell 1</td>
<td>Cell 2</td>
<td>Cell 3</td>
<td>Cell 4</td>
<td><a href="#" id="show_1">Show Extra</a></td>
</tr>
<tr>
<td colspan="5">
<div id="extra_1" style="display: none;">
<br>hidden row
<br>hidden row
<br>hidden row
</div>
</td>
</tr>
</table>
JS
$("a[id^=show_]").click(function(event) {
$("#extra_" + $(this).attr('id').substr(5)).slideToggle("slow");
event.preventDefault();
})
但现在我想点击行展开，而不是显示额外。 但我不知道怎么弄的。
谁能帮帮我吗？
谢谢
http://jsfiddle.net/kbcm5fl4/1/请参阅此小提琴。
null
$(function(){
$("a[id^=show_]").click(function(event) {
$("#extra_" + $(this).attr('id').substr(5)).slideToggle("slow");
event.preventDefault();
})
$('.row').click(function(){
$("#extra_1").slideToggle("slow");
event.preventDefault();
});
});
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
</head>
<body>
<table border="1">
<tr class="row">
<td>Cell 1</td>
<td>Cell 2</td>
<td>Cell 3</td>
<td>Cell 4</td>
<td><a href="#" id="show_1">Show Extra</a></td>
</tr>
<tr >
<td colspan="5">
<div id="extra_1" style="display: none;">
<br>hidden row
<br>hidden row
<br>hidden row
</div>
</td>
</tr>
</table>
</body>
</html>