它应该很简单,但是这个 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>