Jquery表格是我們在使用網頁的過程中常用的一個工具之一，但是當表格內容過多時，可能會出現不能一次性顯示在頁面內的情況。這時我們就需要用到上下滾動條來實現內容的滾動，下面通過一個實例來分享如何使用jquery表格上下滾動條。

<table class="scroll" border="1">
<thead>
<tr>
<th>Name</th>
<th>ID</th>
</tr>
</thead>
<tbody>
<tr>
<td>John</td>
<td>001</td>
</tr>
<tr>
<td>Jane</td>
<td>002</td>
</tr>
<tr>
<td>Bob</td>
<td>003</td>
</tr>
<tbody>
</table>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script>
$(document).ready(function(){
$('.scroll').css({"overflow-y": "scroll", "height": "120px"}); // 設置表格為可滾動，并設置高度
})
</script>

通過上面的代碼，我們首先創建了一個表格，并設置了兩個表格頭（Name和ID），接著通過jQuery設置了表格的樣式。其中，設置overflow-y屬性為scroll可以讓表格出現上下滾動條，height屬性設置表格的高度，當表格內容超出這個高度時就會出現滾動條。

另外，如果我們想要在表格內部設置滾動條，可以在tbody標簽內再添加一個div元素，如下所示：

<table class="scroll" border="1">
<thead>
<tr>
<th>Name</th>
<th>ID</th>
</tr>
</thead>
<tbody>
<div class="scroll_box">
<tr>
<td>John</td>
<td>001</td>
</tr>
<tr>
<td>Jane</td>
<td>002</td>
</tr>
<tr>
<td>Bob</td>
<td>003</td>
</tr>
</div>
<tbody>
</table>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script>
$(document).ready(function(){
$('.scroll_box').css({"overflow-y": "scroll", "height": "120px"}); // 設置滾動條盒子為可滾動，并設置高度
})
</script>

以上就是關于jquery表格上下滾動條的介紹，希望對你有所幫助。