<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" ...
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <link href="./scroll.css" rel="stylesheet" /> <script src='/images/loading.gif' data-original="https://cdn.bootcss.com/jquery/3.2.1/jquery.js"></script> <script src='/images/loading.gif' data-original="./scroll.js"></script> <title>Document</title></head><body> <div > <div > <table id="scroll-table"> <thead> <tr> <th>Months</th> <th>Money</th> </tr> </thead> <tbody id="scroll-tbody"> <tr> <td>January</td> <td>$100</td> </tr> <tr> <td>January</td> <td>$100</td> </tr> <tr> <td>January</td> <td>$100</td> </tr> <tr> <td>January</td> <td>$100</td> </tr> <tr> <td>January</td> <td>$100</td> </tr> <tr> <td>January</td> <td>$100</td> </tr> <tr> <td>January</td> <td>$100</td> </tr> <tr> <td>January</td> <td>$100</td> </tr> <tr> <td>January</td> <td>$100</td> </tr> <tr> <td>January</td> <td>$100</td> </tr> </tbody> </table> </div> </div></body></html>
.scroll-body{ display: inline-block;}.scroll-container{ text-align: center;}#scroll-table{ border: 1px solid; border-collapse: collapse; width: 200px; height: 200px; overflow: auto; display: block;}
$(function () { $('#scroll-table').scroll(function (e) { var pagination = { page: 0, pageSize: 20 }; //滚动条位置 var scrollTop = $('#scroll-table').scrollTop(); //可视窗口的高度 var viewportHeight = $('#scroll-table').height(); //整个页面可以滚动的高度 var scrollHeight = $('#scroll-table')[0].scrollHeight; //“如果滚动条的位置”+“可视窗口的高度”=“整个页面可以滚动的高度”，那么就调用相应的函数加载数据 if (Math.round(scrollTop + viewportHeight) == scrollHeight) { var tr = $('<tr><td> good </td> <td> nice </td> /tr>'); $('#scroll-tbody').append(tr); /* * pagination.page += 1; * dataAjax(pagination); //这里做第二页的数据请求并添加进表格 */ } });})
海外公司注册、海外银行开户、跨境平台代入驻、VAT、EPR等知识和在线办理：https://www.xlkjsw.com
原标题：表格滚动分页
关键词：分页
*特别声明：以上内容来自于网络收集，著作权属原作者所有，如有侵权，请联系我们：
admin#shaoqun.com
（#换成@）。
