jQuery 超屏加载,当文档超出屏幕的高度时,加载最新下个列数据

$(window).scroll(function () {
var height = $(document).height(); //页面的高度
var keheight = $(window).height(); //浏览器可视的高度
var sheight = $(document).scrollTop(); //滚动的高度
var num = $('.pro_list a').length;
if (height <= keheight + sheight) {
$.post('/index.php/ajax-addlist.html', { type: 'class', id: '102', num: num }, function (data) {
if (data == '1') {
$('.loading span').html('无更多数据...');
} else {
$('.pro_list').append(data);
}
//alert(data);
});
} }); $(function () {
var height = $(document).height(); //页面的高度
var keheight = $(window).height(); //浏览器可视的高度 if (keheight >= height) {
$('.loading span').html('无更多数据...');
}
});

  

jQuery 超屏加载的更多相关文章

  1. 滚屏加载--jQuery+PHP实现浏览更多内容

    滚屏加载技术,就是使用Javascript监视滚动条的位置,每次当滚动条到达浏览器窗口底部时,触发一个Ajax请求后台PHP程序,返回相应的数据,并将返回的数据追加到页面底部,从而实现了动态加载,其实 ...

  2. Jquery实现逐屏加载图片

    引用jquery.scrollLoading.js $(document).ready(function () { //实现图片慢慢浮现出来的效果 $("img").load(fu ...

  3. vue项目首屏加载优化实战

    问题 单页面应用的一个问题就是首页加载东西过多,加载时间过长.特别在移动端,单页面应用的首屏加载优化更是绕不开的话题.下面我会写出我在项目中做的一些优化,希望大家能够相互讨论,共同进步. 我的项目vu ...

  4. jQuery实现无限加载瀑布流特效

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  5. 基于jQuery点击加载动画按钮特效

    分享一款基于jQuery点击加载动画按钮特效.这是一款基于jQuery+CSS3实现的鼠标点击按钮加载动画特效代码.效果图如下: 在线预览   源码下载 实现的代码. html代码: <div ...

  6. jQuery文档加载完毕的几种写法

    js中文档加载完毕.一般在body加一个onload事件或者window.onload = function () {} jQuery中有好多写法,平时也不注意,别人一问,还真觉得头大. 下面是我整理 ...

  7. jQuery延迟加载(懒加载)插件 – jquery.lazyload.js-Web前端(W3Cways.com) - Web前端学习之路

    Lazy Load 是一个用 JavaScript 编写的 jQuery 插件. 它可以延迟加载长页面中的图片. 在浏览器可视区域外的图片不会被载入, 直到用户将页面滚动到它们所在的位置. 这与图片预 ...

  8. jquery图片懒加载效果

    1.要引入jquery 2.要引入underscore.js <!DOCTYPE html> <html lang="en"> <head> & ...

  9. react 首屏加载优化

    react 首屏加载优化,原本是在入口HTML文件中加载loading动画,但是部署在测试环境上的时候一直无法显示loading的部分,也是奇怪了,我们测试环境的部署一直跟本地的都不太一样,内外网的转 ...

随机推荐

  1. eclipse配置问题汇总

    问题1:fatjar安装出现故障 问题描写叙述:由于要打包包括第三方jar包的工程,需下载eclipse插件.一般下载地址:http://sourceforge.net/projects/fjep/ ...

  2. Android:intent的基础

    只有一个活动的应用也太简单了吧?没错,你的追求应该更高一点.不管你想创建多少 个活动,方法都和上一节中介绍的是一样的.唯一的问题在于,你在启动器中点击应用的图 标只会进入到该应用的主活动,那么怎样才能 ...

  3. java链表知识点总结

    下面是一个Link类定义的一部分.它包含了一些数据和下一个链结点的引用: ? 1 2 3 4 5 class Link {     public int data;     public int id ...

  4. springcloud超时时间与重试次数配置

    #hystrix配置hystrix.command.default.execution.isolation.thread.timeoutInMilliseconds=120000ribbon.Conn ...

  5. 怎样正确的使用Cookie的Path详细解析

    原文地址:http://java-zone.org/1052.html cookie 有路径--path,表示哪些路径下的文件有权限读取该 cookie. path 应该以 “/” 结尾,同名 coo ...

  6. 内存溢出导致jenkins自动部署到tomcat失败

    原文地址:http://openwares.net/java/jenkens_deploy_to_tomcat_error_of_outofmemoryerror.html jenkins自动部署wa ...

  7. ​0​天​掌​握​i​O​S​开​发​之​D​a​y​2​ ​-​ ​内​存​管​理 (给学生讲解的课件,总结的不错)

    from:   10​天​掌​握​i​O​S​开​发​之​D​a​y​2​ ​-​ ​内​存​管​理

  8. WebRTC 基于GCC的拥塞控制(上)

    转自:http://blog.csdn.net/doitsjz/article/details/56481981 实时流媒体应用的最大特点是实时性,而延迟是实时性的最大敌人.从媒体收发端来讲,媒体数据 ...

  9. [Android Pro] 开发一流Android SDK

    cp from : https://blog.csdn.net/dd864140130/article/details/53558011 本篇文章已授权微信公众号 guolin_blog (郭霖)独家 ...

  10. Guava CaseFormat

    概述 CaseFormat用来转换各种不同的编程语言间的变量名命名格式, 主要用到的方法只有一个 CaseFormat.to(CaseFormat from, String s) CaseFormat ...