基于JQuery实现滚动到页面底端时自动加载更多信息

关键代码:

代码如下:
var stop=true;
$(window).scroll(function(){
totalheight = parseFloat($(window).height()) + parseFloat($(window).scrollTop());
if($(document).height() <= totalheight){
if(stop==true){
stop=false;
$.post("ajax.php", {start:1, n:50},function(txt){
$("#Loading").before(txt);
stop=true;
},"text");
}
}
});  
 HTML: 代码如下: 
<div id="Loading">Loading...</div>
实现方法是比较页面总高度和下滚高度以判断是否到达底端,若到达底端则通过ajax读取更多的内容,用before插入到Loading之前。
stop参数是考虑到ajax读取耗时,防止在一次ajax读取过程中多次触发事件,造成多次加载内容。
 

基于JQuery实现滚动到页面底端时自动加载更多信息的更多相关文章

  1. jQuery自动加载更多程序

    1.1.1 摘要 现在,我们经常使用的微博.微信或其他应用都有异步加载功能,简而言之,就是我们在刷微博或微信时,移动到界面的顶端或低端后程序通过异步的方式进行加载数据,这种方式加快了数据的加载速度,由 ...

  2. jQuery自动加载更多程序(转)

    jQuery自动加载更多程序   1.1.1 摘要 现在,我们经常使用的微博.微信或其他应用都有异步加载功能,简而言之,就是我们在刷微博或微信时,移动到界面的顶端或低端后程序通过异步的方式进行加载数据 ...

  3. jquery列表自动加载更多

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  4. JS实现页面复制文字时自动加版权

    经亲自实践,尝试了各种方法,目前可行的方法主要有如下两种: 可以在任何运行使用js代码的网站中使用,比如本人在自己的博客园博客中实现了一下,读者您可亲自在本人博客上测试. 方法1: <scrip ...

  5. 关于Vue中页面(父组件)下拉,页面中的子组件加载更多数据的实现方法

    一个项目中存在很多这种情况:父组件(页面)中的子组件需要做下拉加载更多的需求,但是这个下拉到底部的动作只能通过监控页面(父组件)来完成 这就需要父子组件之间的通信,代码如下: 1. 建立一个用于父子组 ...

  6. Jquery鼠标滚动到页面底部自动加载更多内容,使用分页

    index.php代码   [html] view plaincopy <!DOCTYPE html PUBLIC ;}                .single_item{padding: ...

  7. Layman H5+Webapp+MUI App 页面滑至到底部自动加载新的内容

    要点:使用jquery的scroll()方法实现,当用户滚动指定的元素时,会发生 scroll 事件 scroll 事件适用于所有可滚动的元素和 window 对象(浏览器窗口) scroll() 方 ...

  8. Jquery+php鼠标滚动到页面底部自动加载更多内容,使用分页

    1.index.php <style type="text/css"> #container{margin:10px auto;width: 660px; border ...

  9. pc网页到移动端怎么自动加载适应移动端的css。

    1.通过link标签判断加入 以前听说过在link标签中加media = "handheld",但这个用到安卓或苹果都不管用,后来尝试以下方法,是管用的. <link hre ...

随机推荐

  1. mysql大表如何优化

    作者:哈哈链接:http://www.zhihu.com/question/19719997/answer/81930332来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明出处 ...

  2. [转载]给Jquery动态添加的元素添加事件

    原文地址:给Jquery动态添加的元素添加事件作者:小飞侠 我想很多人都会向我一样曾经 被新元素的事件绑定困惑很久也就是在页面加载完成后给元素绑定了事件,但又新增加的元素上却没有绑定任何事件. js的 ...

  3. myBatis 实现用户表增删查改操作<方法1 没有使用接口的>(最终版)

    在UserMapper.xml中添加增删改查 <?xml version="1.0" encoding="UTF-8" ?> <!DOCTYP ...

  4. 菜鸟写的第一个chrome插件

    一.新建一个文件夹,用来放插件的代码 二.首先新建配置文件manifest.json // 开发参考:http://open.chrome.360.cn/extension_dev/overview. ...

  5. Socket网络编程(2)--服务端实现

    中秋了,首先祝大家中秋快乐,闲着无事在家整一个socket的聊天程序,有点仿QQ界面,就是瞎折腾,不知道最后是不是能将所有功能实现. 如果你对socket不了解,请看这篇文章:http://www.c ...

  6. CF440C

    C. One-Based Arithmetic time limit per test 0.5 seconds memory limit per test 256 megabytes input st ...

  7. tcp/IP点对点通信程序

    点对点的通信 服务器端与客户端在建立连接之后创建一个进程 服务器端: 子进程用于接收主机的输入并将数据发送出去.父进程用于接收客户端的数据并输出到主机. 子进程一直等待主机的输入,输入的数据放在发送缓 ...

  8. RadioButtonList单选和RequiredFieldValidator验证是否选中

    <asp:RadioButtonList ID="Radio2" RepeatDirection="Horizontal" runat="ser ...

  9. 【leetcode】Binary Search Tree Iterator

    Binary Search Tree Iterator Implement an iterator over a binary search tree (BST). Your iterator wil ...

  10. 【转】利用optimize、存储过程和系统表对mysql数据库表进行批量碎片清理释放表空间

    本文收集于本人的笔记本,由于找不到原文出处.在此省略,如哪位知道可以联系我加上. 核心是利用mysql系统表和“optimize table 表名”命令,对mysql数据表进行空间的释放.由于dele ...