基于JQuery实现滚动到页面底端时自动加载更多信息
基于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实现滚动到页面底端时自动加载更多信息的更多相关文章
- jQuery自动加载更多程序
1.1.1 摘要 现在,我们经常使用的微博.微信或其他应用都有异步加载功能,简而言之,就是我们在刷微博或微信时,移动到界面的顶端或低端后程序通过异步的方式进行加载数据,这种方式加快了数据的加载速度,由 ...
- jQuery自动加载更多程序(转)
jQuery自动加载更多程序 1.1.1 摘要 现在,我们经常使用的微博.微信或其他应用都有异步加载功能,简而言之,就是我们在刷微博或微信时,移动到界面的顶端或低端后程序通过异步的方式进行加载数据 ...
- jquery列表自动加载更多
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
- JS实现页面复制文字时自动加版权
经亲自实践,尝试了各种方法,目前可行的方法主要有如下两种: 可以在任何运行使用js代码的网站中使用,比如本人在自己的博客园博客中实现了一下,读者您可亲自在本人博客上测试. 方法1: <scrip ...
- 关于Vue中页面(父组件)下拉,页面中的子组件加载更多数据的实现方法
一个项目中存在很多这种情况:父组件(页面)中的子组件需要做下拉加载更多的需求,但是这个下拉到底部的动作只能通过监控页面(父组件)来完成 这就需要父子组件之间的通信,代码如下: 1. 建立一个用于父子组 ...
- Jquery鼠标滚动到页面底部自动加载更多内容,使用分页
index.php代码 [html] view plaincopy <!DOCTYPE html PUBLIC ;} .single_item{padding: ...
- Layman H5+Webapp+MUI App 页面滑至到底部自动加载新的内容
要点:使用jquery的scroll()方法实现,当用户滚动指定的元素时,会发生 scroll 事件 scroll 事件适用于所有可滚动的元素和 window 对象(浏览器窗口) scroll() 方 ...
- Jquery+php鼠标滚动到页面底部自动加载更多内容,使用分页
1.index.php <style type="text/css"> #container{margin:10px auto;width: 660px; border ...
- pc网页到移动端怎么自动加载适应移动端的css。
1.通过link标签判断加入 以前听说过在link标签中加media = "handheld",但这个用到安卓或苹果都不管用,后来尝试以下方法,是管用的. <link hre ...
随机推荐
- python numpy 教程
http://blog.chinaunix.net/uid-21633169-id-4408596.html
- DEDECMS全版本gotopage变量XSS ROOTKIT 0DAY
影响版本: DEDECMS全版本 漏洞描叙: DEDECMS后台登陆模板中的gotopage变量未效验传入数据,导致XSS漏洞. \dede\templets\login.htm 65行左右 < ...
- nginx负载均衡的配置方法
upstream www.***.com { server ; server ; server ; } server { listen ; server_name www.***.com; #char ...
- mybatis中的resultMap
resultMap <?xml version="1.0" encoding="UTF-8" ?> <!DOCTYPE mapper PUBL ...
- object-c 的ARC 问答/介绍
原文:http://blog.csdn.net/kmyhy/article/details/8895606 概念" Clangstatic analyzer "是一个非常有用的查找 ...
- derby支持的数据类型
Data types This section describes the data types used in Derby. Built-In type overview Numeric types ...
- HttpResponse对象
为了响应客户端的请求,同样定义了代表响应的类:HttpResponse类,它也定义在命名空间System.Web下,提供向客户端响应的方法和属性. HttpResponse常用属性和方法 响应对象用于 ...
- 探讨关于C#中Foreach的本质
一.为什么数组和集合可以使用foreach遍历 01. 因为数组和集合都实现了IEnumerable接口,该接口中只有一个方法,GetEnumerator() 02.数组类型是从抽象基类型 Array ...
- why we use Symbols in Hash
Rather than using Strings as the keys in a Hash, it’s better practice to use Symbols. Symbols are ju ...
- Proc 和 代码块
文章是从个人博客 搬过来的,大家也可以直接访问我的个人博客哦http://www.iwangzheng.com/ 如何将一段代码从对象中取出并将它像对象一样传递.在ruby中,一个Proc是一个包含一 ...