$(window).scroll(function () {
        var scrollTop = $(this).scrollTop();
        var scrollHeight = $(document).height();
        var windowHeight = $(this).height();
        if (scrollTop + windowHeight == scrollHeight) {
          //此处是滚动条到底部时候触发的事件,在这里写要加载的数据,或者是拉动滚动条的操作
          //shlar page = Number($("#redgiftNextPage").attr('currentpage')) + 1;
          //redgiftList(page);
         //$("#redgiftNextPage").attr('currentpage', page + 1);

    console.log("到底了,发起请求")
  }
});

解析:
判断滚动条到底部,需要用到DOM的三个属性值,即scrollTop、clientHeight、scrollHeight。
scrollTop为滚动条在Y轴上的滚动距离。
clientHeight为内容可视区域的高度。
scrollHeight为内容可视区域的高度加上溢出(滚动)的距离。
从这个三个属性的介绍就可以看出来,滚动条到底部的条件即为scrollTop + clientHeight == scrollHeight。(兼容不同的浏览器)。

原页面地址:https://www.cnblogs.com/chen-lhx/p/5121360.html

jQuery页面滚动底部加载数据的更多相关文章

  1. Jquery页面滚动动态加载数据,页面下拉自动加载内容

    <!DOCTYPE=html> <html> <head> <script src="js/jquery.js" type="t ...

  2. 页面滚动动态加载数据,页面下拉自动加载内容 jquery

    <!DOCTYPE=html> <html> <head> < script src="js/jquery.js" type=" ...

  3. JQuery ajax 滚动底部加载更多

    <%@ Page Language="C#" %> <%@ Import Namespace="System.IO" %> <%@ ...

  4. Android中GridView滚动到底部加载数据终极版

    之前在项目中有一个需求是需要GridView控件,滚动到底部自动加载.但是呢GridView控件并不提供诸如ListView监听滚动到底部的onScrollListener方法,为了实现这样一个效果, ...

  5. Ajax 滚动异步加载数据

    第一种情况:单个div滚动 HTML <body> <!-- search start --> <div class="search" #if($m_ ...

  6. div滚动底部加载li,window滚动底部加载li

    DIV固定高度滚动条滚动最底部,加载新的li <!DOCTYPE html> <html> <head> <meta charset="UTF-8& ...

  7. [转]JavaScript实现 页面滚动图片加载

    本文转自:http://www.cnblogs.com/Darren_code/archive/2011/07/21/LoadImage.html 又到了这个月的博客时间了,原计划是打算在这个月做一个 ...

  8. AppCan学习笔记----关闭页面listview动态加载数据

    AppCan页面关闭 AppCan 的页面是由两个HTML组成,如果要完全关闭的话需要在主HTML eg.index.html中关闭,关闭方法:appcan.window.close(-1); 管道 ...

  9. 滚动加载|页面滑到底部加载数据|jquery.endless-scroll插件|使用demo

    <html> <head> <link rel="dns-prefetch" href="http://i.tq121.com.cn&quo ...

随机推荐

  1. json中带有\r\n处理

    后台代码把换行符\r\n替换为\\r\\n,前台代码js收到的字符就是\r\n

  2. PHP获取表单并使用数组存储 疯狂提示 Notice: Undefined offset

    $answer=array(); $answer[0]='0'; for($i=1;$i<=$QUESTION_COUNT;$i++){ $answer[$i]=$_POST[(string)$ ...

  3. Python之List列表的循环和切片

    一.循环(for):输出列表中的每一个元素 stus=['杨静','王志华','王银梅','乔美玲'] #一个个输出列表元素 for s in stus: print('s 是 %s'%s) s 是 ...

  4. Socket与TCP,UDP

    什么是socket 简单来说是IP地址与端口的结合协议(RFC 793) 一种地址与端口的结合描述协议 TCP/IP协议的 相关API的总称:是网络api的集合实现 涵盖了:Stream Socket ...

  5. MIME 类型

    关于读音 为了防止大家出去丢人,我先示范一下,MIME应该独坐[maim],听起来就好像“男人”的英语法人一样. 浏览器和MIME的关系 浏览器依靠MIME类型解释网页. 每当浏览器请求一个web页面 ...

  6. 【mmall】IDEA插件jrebel

    破解方法 http://www.jianshu.com/p/87b11bad3d7f

  7. Xml的转义字符--约束-xml解析器

    XML解析器:Dom适合增删改查(crud),缺点就是内存消耗大:  Sax:内存消耗非常小,解析速度快,但是不适合增删改:

  8. Struts2-052 漏洞复现

    s2-052漏洞复现 参考链接: http://www.freebuf.com/vuls/147017.html http://www.freebuf.com/vuls/146718.html 漏洞描 ...

  9. shell编程 之 传递参数到脚本里

    1 传递参数的基本格式 在脚本的需要参数的地方写$1,$2,$3...$n,运行的时候带参数运行就相当于是专递参数进shell脚本里了,比如: ./t1.sh 1 2 #!/bin/bash echo ...

  10. UVA1660 电视网络 Cable TV Network

    题目地址:UVA1660 电视网络 Cable TV Network 枚举两个不直接连通的点 \(S\) 和 \(T\) ,求在剩余的 \(n-2\) 个节点中最少去掉多少个可以使 \(S\) 和 \ ...