`

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

    博客分类:
  • 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控制滚动条下拉后DIV容器在页面中的位置

    标题中的“jquery控制滚动条下拉后DIV容器在页面中的位置”是指利用jQuery库来实现一个功能,即在用户滚动网页时,使指定的DIV元素始终保持在屏幕的某个固定位置,这种效果通常被称为“粘性导航”或“固定定位”。...

    jquery 下拉刷新上拉加载

    总之,jQuery和iScroll结合使用,为开发者提供了强大的工具来实现下拉刷新和上拉加载功能,使得动态加载内容变得更加简单和高效。通过深入理解这两个库以及它们之间的交互,开发者可以创建出更加互动和用户友好的Web...

    jQuery的滚动条事件插件jquery-waypoints

    **jQuery的滚动条事件插件:jquery-waypoints** 在网页设计和开发中,用户体验是至关重要的,而良好的交互性能够显著提升用户对网站的满意度。jQuery Waypoints 是一个优秀的JavaScript库,专门用于处理页面滚动时...

    jQuery实现下拉加载功能实例代码

    在网页开发中,下拉加载(也称为无限滚动或滚动加载)是一种常见的用户体验优化技术,它允许用户在滚动页面到底部时自动加载更多内容,而无需点击“加载更多”按钮。这种功能尤其适用于内容丰富的网站,如社交媒体、...

    jQuery实现模仿微博下拉滚动条加载数据效果

    在本文中,我们将深入探讨如何使用jQuery来实现一个模仿微博下拉滚动条加载数据的效果。这个功能常见于许多社交媒体和新闻网站,它允许用户在滚动到底部时自动加载更多内容,提供流畅的浏览体验,无需点击额外的...

    jQuery实现滚动到底部时自动加载更多的方法示例

    通过这种方式,用户在浏览页面时,只要滚动到底部,就会自动触发加载更多内容的请求,从而实现无限滚动的效果。这个功能对于提升用户体验和优化网页性能都有积极的作用。同时,这个示例也展示了如何结合jQuery和AJAX...

    下拉刷新,上拉加载,JqueryMobile1.4.3+iScroll4

    在移动应用开发中,"下拉刷新"和"上拉加载"是常见的功能,用于提升用户体验,特别是当处理大量数据时。这两个特性使得用户能够轻松地获取最新的信息或浏览更多的内容,而无需离开当前页面。这里我们将深入探讨如何...

    简单的jquery图片列表瀑布流布局代码没有无限加载功能

    以下是一个简单的无限加载实现: ```javascript $(window).scroll(function() { if ($(window).scrollTop() + $(window).height() >= $(document).height()) { // 发送Ajax请求获取更多图片数据 $.ajax({ url: '...

    jquery简单实现滚动条下拉DIV固定在头部不动

    标题中的"jquery简单实现滚动条下拉DIV固定在头部不动"描述了一个常见的网页设计功能,即当用户滚动页面时,某个特定的DIV元素(在这个例子中是类名为`.pf`的元素)会在达到预设位置(这里是250像素)后,始终保持在...

    jQuery实例(菜单、滚动、层隐藏等)

    本文将详细解析"jQuery实例(菜单、滚动、层隐藏等)"的相关知识点,帮助你深入理解并应用这些功能。 首先,我们来看菜单的实现。在网页设计中,菜单是用户导航的重要组成部分。jQuery提供了方便的方法来创建动态和...

    jQuery网页上下滚动背景变色特效

    "jQuery网页上下滚动背景变色特效"就是一个这样的实例,它能够随着用户浏览页面时的滚动动作,动态改变网页的背景颜色,创造出独特的视觉体验。这个特效的实现基于JavaScript库jQuery,jQuery以其简洁的API和丰富的...

    jquery 滚动条事件简单实例

    代码如下:<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” ...<head><... charset=utf-8″ /><...script type=”text/javascript” src=”

    jQuery滚屏加载_Ajax滚屏加载

    在网上找了很多例子,但总是有bug,特别是数据会重复。我就做了个演示教程。...若是想看该网页特效教程 http://www.sucaihuo.com/js/9.html,滚动条下拉到最后,还可以查看演示并且还有下载压缩文件哦,真的很完美。。

    jquery使用iscorll实现上拉、下拉加载刷新

    总之,通过本文的介绍和实例代码,我们可以看到使用jQuery和iscroll来实现上拉下拉刷新功能是完全可行的,开发者只需根据实际需求调整和扩展代码即可实现所需功能。这种功能的实现,不仅提升了用户交互体验,也为...

    页面滚动分页---iScroll实例:下拉刷新,滚动翻页

    同时,还可以通过调整配置项来优化滚动性能,例如设置`scrollbars`控制滚动条的显示,设置`mouseWheel`控制鼠标滚轮的滚动行为。 5. **与后端交互**:在实际应用中,下拉刷新和滚动分页通常需要与后端API进行通信,...

    JQuery插件iScroll实现下拉刷新,滚动翻页特效

    - 类似于下拉刷新,监听滚动条位置,当滚动到一定位置时触发加载更多的功能。 - 同样使用$.ajax进行数据请求,将返回的数据显示在页面上。 - 数据加载完毕后,同样调用iScroll的refresh方法更新界面。 4. 页面...

    jQuery+EasyUI实现头部固定带滚动条table表格特效源码.zip

    本资源"jQuery+EasyUI实现头部固定带滚动条table表格特效源码.zip"提供了一个使用这两者实现的特殊功能:在表格内容过多时,保持表头固定并添加滚动条的效果,这在数据展示和管理中十分常见。 jQuery是一个轻量级的...

    JQuery&CSS;&CSS;+DIV实例大全.rar

    31.jQuery实现拖动滚动条的缩略图排列插件下载 32.jQuery实现焦点图片Flash自动平滑渐变效果 33.jQuery实现鼠标移到链接提示显示图片功能插件 34.jquery实现鼠标经过链接放大图片特效代码 35.jquery实用...

Global site tag (gtag.js) - Google Analytics