jquery 实现滚动条下拉时无限加载的简单实例


Posted in Javascript onJune 01, 2016

思路:

通过捕捉浏览器滚动条下拉事件,触发异步加载数据的js方法,实现数据的动态添加。

脚本:

var lastId=0;//记录每一次加载时的最后一条记录id,跟您的排序方式有关。

  var isloading = false;
  $(window).bind("scroll", function () {
    if ($(document).scrollTop() + $(window).height() 

       > $(document).height() - 10 && !isloading) {
      isloading = true;
      getMore();
    }
  });



function getMore() {
    var url = "ajaxdata.aspx"?lastId=" + lastId +"&type=" + 其他参数
    $.getJSON(url, function (data) { 
      var html="";

       ... ...

      $(html).insertAfter($(".elem").last());
      isloading = false;
    }

  }

以上这篇jquery 实现滚动条下拉时无限加载的简单实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
js自动生成对象的属性示例代码
Oct 28 Javascript
js面向对象编程之如何实现方法重载
Jul 02 Javascript
JavaScript通过元素的ID和name设置样式
Jul 08 Javascript
js对象基础实例分析
Jan 13 Javascript
javascript实现英文首字母大写
Apr 23 Javascript
AngularJs $parse、$eval和$observe、$watch详解
Sep 21 Javascript
angular过滤器实现排序功能
Jun 27 Javascript
Vue实现table上下移动功能示例
Feb 21 Javascript
vue-element-admin 菜单标签失效的解决方式
Nov 12 Javascript
详细分析Node.js 多进程
Jun 22 Javascript
Vue实现可移动水平时间轴
Jun 29 Javascript
使用webpack5从0到1搭建一个react项目的实现步骤
Dec 16 Javascript
sencha ext js 6 快速入门(必看)
Jun 01 #Javascript
Bootstrap3.0建站教程(一)之bootstrap表单元素排版
Jun 01 #Javascript
分享一个插件实现水珠自动下落效果
Jun 01 #Javascript
js匿名函数作为函数参数详解
Jun 01 #Javascript
仅9张思维导图帮你轻松学习Javascript 就这么简单
Jun 01 #Javascript
JavaScript中匿名函数的用法及优缺点详解
Jun 01 #Javascript
Bootstrap 折叠(Collapse)插件用法实例详解
Jun 01 #Javascript
You might like
PHP个人网站架设连环讲(二)
2006/10/09 PHP
php Calender(日历)代码分享
2014/01/03 PHP
PHP结合JQueryJcrop实现图片裁切实例详解
2014/07/24 PHP
php5.4以上版本GBK编码下htmlspecialchars输出为空问题解决方法汇总
2015/04/03 PHP
PHP学习笔记之php文件操作
2016/06/03 PHP
PHP面向对象程序设计之接口的继承定义与用法详解
2018/12/20 PHP
javascript下查找父节点的简单方法
2007/08/13 Javascript
javascript事件问题
2009/09/05 Javascript
关于javascript中this关键字(翻译+自我理解)
2010/10/20 Javascript
asp.net中System.Timers.Timer的使用方法
2013/03/20 Javascript
connect中间件session、cookie的使用方法分享
2014/06/17 Javascript
javascript里使用php代码实例
2014/12/13 Javascript
JS密码生成与强度检测完整实例(附demo源码下载)
2016/04/06 Javascript
浅谈jQuery中ajaxPrefilter的应用
2016/08/01 Javascript
JS判断微信扫码的方法
2017/08/07 Javascript
Vue添加请求拦截器及vue-resource 拦截器使用
2017/11/23 Javascript
node.js利用socket.io实现多人在线匹配联机五子棋
2018/05/31 Javascript
详解一次Vue低版本安卓白屏问题的解决过程
2019/05/30 Javascript
使用vue实现HTML页面生成图片的方法
2020/03/12 Javascript
详解JavaScript 异步编程
2020/07/13 Javascript
JavaScript中window和document用法详解
2020/07/28 Javascript
解决vue addRoutes不生效问题
2020/08/04 Javascript
同时安装Python2 & Python3 cmd下版本自由选择的方法
2017/12/09 Python
python编写朴素贝叶斯用于文本分类
2017/12/21 Python
python使用筛选法计算小于给定数字的所有素数
2018/03/19 Python
Python GUI Tkinter简单实现个性签名设计
2018/06/19 Python
一篇文章搞懂python的转义字符及用法
2020/09/03 Python
简述python&pytorch 随机种子的实现
2020/10/07 Python
Python使用struct处理二进制(pack和unpack用法)
2020/11/12 Python
阻止移动设备(手机、pad)浏览器双击放大网页的方法
2014/06/03 HTML / CSS
DC Shoes官网:美国滑板鞋和服饰品牌
2017/09/03 全球购物
全球在线商店:BerryLook
2019/04/14 全球购物
女性时尚网购:Chic Me
2019/07/30 全球购物
入党思想汇报怎么写
2014/04/03 职场文书
2015年青年志愿者协会工作总结
2015/04/27 职场文书
Golang Elasticsearches 批量修改查询及发送MQ
2022/04/19 Golang