时间戳

首页 > 解决方案 > 我想使用 jquery 在静态表上进行无限滚动

jquery - 我想使用 jquery 在静态表上进行无限滚动

问题描述

我有一个看起来像这样的 html 表：

<table class="data-table">
<thead>
    <tr>
        <th>Course</th>
        <th>Section</th>
        <th>Faculty</th>
        <th>Time</th>
        <th>Room</th>
        <th>Capacity</th>
        <th>Semester</th>
    </tr>
</thead>
<tbody>

    <tr>
        <td><a class="course" href="#">ACT201</a></td>
        <td>1</td>
        <td><a class="faculty" href="#">Ani</a></td>
        <td>MW 11:20 AM - 12:50 PM</td>
        <td>NAC993</td>
        <td>41(42)</td>
        <td><a class="semester" href="#">Spring 2020</a></td>
    </tr>

</tbody>

部分将有更多行。我想要做的是隐藏除前 50 行之外的所有行。当用户滚动到表格底部时，将显示另外 50 行，依此类推。

所以，基本上我想做的是在静态表上无限滚动（不使用ajax从另一个页面加载数据）。

我怎样才能做到这一点？

标签： jqueryscrollstaticinfinite

解决方案

您可以尝试jquery.tableScroll，但我强烈建议使用较新的“vanilla JS”库，例如Clusterize来完成滚动表。

推荐阅读