- var obj = new Object();
- obj.IsGetData = false; //是否存在数据加载
- obj.Time = 0; //时间声明(模拟)
- // 描 述:游缆器滚动事件
- window.onscroll = function() {
- if (uiIsPageBottom() && !obj.IsGetData) {
- //状态;
- obj.IsGetData = true;
- //模拟Ajax加载;
- obj.Time = window.setTimeout('GetAjaxData()', 3000); //模拟Ajax加载;使用Ajax数据注释掉本行
- }
- }
- // 描 述:模式Ajax加载数据
- function GetAjaxData() {
- // 知识点:cloneNode(true) 克隆元素
- var table = document.getElementById("Table").cloneNode(true);
- // 用于渐变内容区分,知识点: 两个数字之间求余 使用“%”
- table.style.backgroundColor= (obj.Index%2==0?"#999999":"#FFFFFF");
- document.body.appendChild(table);
- //状态
- if (true) {
- // 知识点: window.setTimeout window.clearTimeout 对称关系,有设置set就要清除clear
- // (时间长了耗费系统内存,有可能回导致IE崩溃,所以清除时间点,使用Ajax返回数据注释掉本行)
- if (obj.Time != 0) window.clearTimeout(obj.Time);
- document.body.removeChild(obj.div);
- }
- obj.IsGetData = false;
- }
- // 描 述:判断是滚动到页面底部
- function uiIsPageBottom() {
- var scrollTop = 0;
- var clientHeight = 0;
- var scrollHeight = 0;
- if (document.documentElement && document.documentElement.scrollTop) {
- scrollTop = document.documentElement.scrollTop;
- } else if (document.body) {
- scrollTop = document.body.scrollTop;
- }
- if (document.body.clientHeight && document.documentElement.clientHeight) {
- clientHeight = (document.body.clientHeight < document.documentElement.clientHeight) ? document.body.clientHeight: document.documentElement.clientHeight;
- } else {
- clientHeight = (document.body.clientHeight > document.documentElement.clientHeight) ? document.body.clientHeight: document.documentElement.clientHeight;
- }
- // 知识点:Math.max 比较大小,取最大值返回
- scrollHeight = Math.max(document.body.scrollHeight, document.documentElement.scrollHeight);
- if (scrollTop + clientHeight == scrollHeight) {
- return true;
- } else {
- return false;
- }
- }
- //该片段来自于http://www.codesnippet.cn/detail/151120137196.html
来源: http://www.codesnippet.cn/detail/151120137196.html