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表格分页实现代码
Sep 18 Javascript
仅Firefox中链接A无法实现模拟点击以触发其默认行为
Jul 31 Javascript
extjs tabpanel限制选项卡数量实现思路及代码
Apr 02 Javascript
密码框显示提示文字jquery示例
Aug 29 Javascript
javascript异步编程代码书写规范Promise学习笔记
Feb 11 Javascript
javascript实现九宫格相加数值相等
May 28 Javascript
JavaScript学习笔记之数组去重
Mar 23 Javascript
js实现的下拉框二级联动效果
Apr 30 Javascript
JS动态加载脚本并执行回调操作
Aug 24 Javascript
再谈javascript注入 黑客必备!
Sep 14 Javascript
jquery checkbox的相关操作总结
Oct 17 Javascript
完美实现js选项卡切换效果(二)
Mar 08 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
虹吸式咖啡壶操作
2021/03/03 冲泡冲煮
php获取远程图片的两种 CURL方式和sockets方式获取远程图片
2011/11/07 PHP
phpstrom使用xdebug配置方法
2013/12/17 PHP
Javascript实例教程(19) 使用HoTMetal(5)
2006/12/23 Javascript
菜鸟学习JavaScript小实验之函数引用
2010/11/17 Javascript
JS+flash实现chrome和ie浏览器下同时可以复制粘贴
2013/09/22 Javascript
jquery ajax 简单范例(界面+后台)
2013/11/19 Javascript
简介JavaScript中substring()方法的使用
2015/06/06 Javascript
JavaScript获取表格(table)当前行的值、删除行、增加行
2015/07/03 Javascript
javascript深拷贝(deepClone)详解
2016/08/24 Javascript
强大Vue.js组件浅析
2016/09/12 Javascript
Node.js Sequelize如何实现数据库的读写分离
2016/10/23 Javascript
微信小程序 form组件详解
2016/10/25 Javascript
JavaScript中关于iframe滚动条的去除和保留
2016/11/17 Javascript
bootstrap fileinput 上传插件的基础使用
2017/02/17 Javascript
nodejs中模块定义实例详解
2017/03/18 NodeJs
electron实现qq快捷登录的方法示例
2018/10/22 Javascript
在vue里使用codemirror遇到的问题
2018/11/01 Javascript
Vue指令指令大全
2019/02/09 Javascript
express启用https使用小记
2019/05/21 Javascript
Python实现的彩票机选器实例
2015/06/17 Python
通过Py2exe将自己的python程序打包成.exe/.app的方法
2018/05/26 Python
python3实现SMTP发送邮件详细教程
2018/06/19 Python
Python神奇的内置函数locals的实例讲解
2019/02/22 Python
Python中字符串与编码示例代码
2019/05/20 Python
最新2019Pycharm安装教程 亲测
2020/02/28 Python
win10安装python3.6的常见问题
2020/07/01 Python
python利用opencv实现颜色检测
2021/02/23 Python
iframe与window.onload如何使用详解
2020/05/07 HTML / CSS
韩国知名的家庭购物网站:CJmall
2016/08/01 全球购物
人事部主管岗位职责
2013/12/26 职场文书
2015年药店工作总结
2015/04/20 职场文书
监护人证明
2015/06/19 职场文书
导游词之新疆-喀纳斯
2019/10/10 职场文书
完美解决golang go get私有仓库的问题
2021/05/05 Golang
Elasticsearch6.2服务器升配后的bug(避坑指南)
2022/09/23 Servers