基于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. 锋利的jQuery-5--网页换肤

    网页换肤原理:通过调用不同的样式表文件来实现不同的皮肤,并且将切换好的皮肤计入cookie. 例子:通过点击上边的颜色设置下边显示的背景色. html代码: <!-- head部分引入的css样 ...

  2. Centos 5.x/6.x 配置163网易yum源

    Centos系统默认都是系统自带的yum源,国内用户用yum源安装比较慢,为了提高效率,一般我们会配置国内的yum源.国内比较好的yum源有网易yum源.搜狐yum源等. 我感觉网易的yum源比较好用 ...

  3. 复选框全选、全不选和反选的效果实现VIEW:1592

    <html> <head> <meta http-equiv="Content-Type" content="text/html; char ...

  4. 基于无锁的C#并发队列实现(转载)

    最近开始学习无锁编程,和传统的基于Lock的算法相比,无锁编程具有其独特的优点,Angel Lucifer的关于无锁编程一文对此有详细的描述. 无锁编程的目标是在不使用Lock的前提下保证并发过程中共 ...

  5. ASP.NET MVC 4 跨域

    <system.webServer> <httpProtocol> <customHeaders> <add name="Access-Contro ...

  6. win7下virtualbox装linux共享win7文件问题(已测试可用)

    virtualbox这个比较强大,在win7上跑redhat5u4很流畅.os之间共享文件是个大家都很关心的问题,这会直接关系到虚拟机用的爽不爽. 在win7和其上的虚拟机linux之间共享文件也很容 ...

  7. centos安装软件Error: Cannot find a valid baseurl for repo: base

    今天使用yum安装软件,出现下面的提示: Loaded plugins: fastestmirror, refresh-packagekit, securityLoading mirror speed ...

  8. cocos2d::Vector

    C++中的vector使用范例 一.概述 vector是C++标准模板库中的部分内容,它是一个多功能的,能够操作多种数据结构和算法的模板类和函数库.vector是一个容器,它能够存放各种类型的对象,简 ...

  9. 转:github使用教程(重装系统后遇到问题该文章帮我解决了)

    github简单使用教程 时间:2012 年 5 月 29 日 6 条评论 分类:学习笔记 , 网络 , 软件 目录 1.注册账户以及创建仓库 2.安装客户端msysgit 3.配置Git 4.提交. ...

  10. Nginx+tomcat负载均衡配置

    Nginx+tomcat是目前主流的java web架构,如何让nginx+tomcat同时工作呢,也可以说如何使用nginx来反向代理tomcat后端均衡呢?直接安装配置如下: 1.JAVA JDK ...