它应该很简单，但是这个 jQuery 函数占用了太多元素，我认为它甚至隐藏了 jQuery。
我想做的是，当一个人点击tr th时，所有下一个tr td应该隐藏，直到下一个tr th>.
我怎样才能让这段代码工作？
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<style>
th { background:#dad;
font-weight:bold;
font-size:16px;
width: 50%;
}
td { background:red;
font-weight:bold;
font-size:16px;
width: 50%;
}
</style>
</head>
<body>
<table id="example">
<tr>
<th>
<button>Show it 3</button>
</th>
</tr>
<tr>
<td>test 1</td>
</tr>
<tr>
<td>test 2</td>
</tr>
<tr>
<th>
<button>Show it 2</button>
</th>
</tr>
<tr>
<td>test 3</td>
</tr>
<tr>
<td>test 4</td>
</tr>
</table>
<script>
$('#example tr th').click( function() {
//alert($(this).parent().html())
$(this).parent().nextUntil('tr th').toggle();
})
</script>
</body>
</html>
最佳答案
您可以向具有第 th 元素的 tr 元素添加一个类:
<table id="example">
<tr>
<th class='toggle'>
<button>Show it 3</button>
</th>
</tr>
<tr>
<td>test 1</td>
</tr>
<tr>
<td>test 2</td>
</tr>
<tr class='toggle'>
<th>
<button>Show it 2</button>
</th>
</tr>
<tr>
<td>test 3</td>
</tr>
<tr>
<td>test 4</td>
</tr>
</table>
$('#example tr th').click( function() {
$(this).parent().nextUntil('.toggle').toggle();
})
关于jquery - 隐藏所有下一个 tr td 直到下一个 tr th，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/11414965/