基于JavaScript实现表格滚动分页

前端之家收集整理的这篇文章主要介绍了基于JavaScript实现表格滚动分页前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

本文实例为大家分享了js实现表格滚动分页展示的具体代码,供大家参考,具体内容如下

<Meta charset="UTF-8"> <Meta name="viewport" content="width=device-width,initial-scale=1.0"> <Meta http-equiv="X-UA-Compatible" content="ie=edge"> Document
Months Money

CSS:

JS:

//可视窗口的高度
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); //这里做第二页的数据请求并添加进表格
    */
    }
    });
    })

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持编程之家。

猜你在找的JavaScript相关文章