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 相关文章推荐
JSON 客户端和服务器端的格式转换
Aug 27 Javascript
JSQL 基于客户端的成绩统计实现方法
May 05 Javascript
使用jQuery异步加载 JavaScript脚本解决方案
Apr 20 Javascript
字段太多jquey快速清空表单内容方法
Aug 21 Javascript
微信小程序 video组件详解
Oct 25 Javascript
js实现背景图自适应窗口大小
Jan 10 Javascript
js获取元素下的第一级子元素的方法(推荐)
Mar 05 Javascript
15个顶级开源JavaScript框架和库
Oct 10 Javascript
Vue如何实现监听组件原生事件
Jul 03 Javascript
vue flex 布局实现div均分自动换行的示例代码
Aug 05 Javascript
vue项目中微信登录的实现操作
Sep 08 Javascript
Vue看了就会的8个小技巧
Jan 21 Vue.js
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安全配置详细说明
2011/09/26 PHP
解析CI即CodeIgniter框架在Nginx下的重写规则
2013/06/03 PHP
3个PHP多维数组转为一维数组的方法实例
2014/03/13 PHP
一个经典的PHP验证码类分享
2014/11/18 PHP
[JS源码]超长文章自动分页(客户端版)
2007/01/09 Javascript
javascript限制文本框只允许输入数字(曾经与现在的方法对比)
2013/01/18 Javascript
JavaScript起点(严格模式深度了解)
2013/01/28 Javascript
js 判断上传文件大小及格式代码
2013/11/13 Javascript
javacript使用break内层跳出外层循环分析
2015/01/12 Javascript
Hallo.js基于jQuery UI所见即所得的Web编辑器
2016/01/26 Javascript
JS onkeypress兼容性写法详解
2016/04/27 Javascript
JavaScript判断微信浏览器实例代码
2016/06/13 Javascript
微信小程序 时间格式化(util.formatTime(new Date))详解
2016/11/16 Javascript
详解JavaScript对象的深浅复制
2017/03/30 Javascript
vue2.0全局组件之pdf详解
2017/06/26 Javascript
Vue项目webpack打包部署到服务器的实例详解
2017/07/17 Javascript
JS实现问卷星自动填问卷脚本并在两秒自动提交功能
2020/06/17 Javascript
JavaScript检测浏览器是否支持CSS变量代码实例
2020/04/03 Javascript
[02:41]DOTA2英雄基础教程 亚巴顿
2014/01/02 DOTA
[59:26]DOTA2上海特级锦标赛D组资格赛#1 EG VS VP第二局
2016/02/28 DOTA
Python入门_浅谈for循环、while循环
2017/05/16 Python
Python基于opencv实现的简单画板功能示例
2019/03/04 Python
python实现统计文本中单词出现的频率详解
2019/05/20 Python
python实现控制COM口的示例
2019/07/03 Python
python实现的Iou与Giou代码
2020/01/18 Python
Python单链表原理与实现方法详解
2020/02/22 Python
解决pycharm中的run和debug失效无法点击运行
2020/06/09 Python
Python sorted对list和dict排序
2020/06/09 Python
韩国11街:11STREET
2018/03/27 全球购物
英国和爱尔兰最大的地毯零售商:Kukoon
2018/12/17 全球购物
贪睡宠物用品:Snoozer Pet Products
2020/02/04 全球购物
团队精神演讲稿
2013/12/31 职场文书
九年级历史教学反思
2014/01/27 职场文书
班组长安全工作职责
2014/07/15 职场文书
小学生五一劳动节演讲稿
2015/03/18 职场文书
DIV CSS实现网页背景半透明效果
2021/12/06 HTML / CSS