JQ-滚动条下拉无限的加载数据

一、原理

  利用滚动的高度,如果滚动的高度到达一定范围,就加载数据

二、实现

  利用$(document.body).outerWidth()获取的是屏幕的高度,这个是固定的,不变的

  利用$(window).scrollTop()获取您滚动的高度

  利用$(document).height()获取总的高度 

  注:$(widnow).height()这个是可视区的高度,这个跟$(document).height()很容易混淆

三、上代码

  

<section>
  <div id="tishi">
    <p>this is a scroll test;</p>
    <p>页面下拉自动加载内容</p>
  </div>
  <div id="main">
    <p>hello world test DIV</p>
  </div>
</section>

$(function(){
  $(window).scroll(function(){
    if($(window).scrollTop() > $(document.body).outerWidth() - $(‘#tishi‘).height()){
      var s=‘<p class="load">我可以无限制的加载...</p>‘;
      $(‘#main‘).append(s);
    }
  })
})

时间: 2024-08-28 09:03:52

JQ-滚动条下拉无限的加载数据的相关文章

IOS控件 Tableview 下拉刷新,加载数据

一. 点击此连链接下载资源文件,将EGORefreshTableHeaderView.h.EGORefreshTableHeaderView.m两个文件,以及Enormego提供的那一套图片包拖进你的工程里. 二.找到你的  UITableViewController 的 .h 文件,添加相应的代码: #import "EGORefreshTableHeaderView.h" @interface RootViewController : UITableViewController {

10.下拉刷新、加载更多、标记已读、轮播条、缓存

下拉刷新.加载更多.标记已读.轮播条.缓存 下拉刷新------- 1.addHeaderView必须在setAdapter之前调用 2.将paddingTop设置一个headerView高度的负值去隐藏它 getHeight()和getMeasuredHeight()的区别: getMeasuredHeight():获取测量完的高度,只要在onMeasure方法执行完,就可以用 它获取到宽高,在自定义控件内部多使用这个 使用view.measure(0,0)方法可以主动通知系统去测量,然后就

retrofit+rxjava+recyclerview+下拉刷新+自动加载更多

安卓开发过程中,网络请求与下拉刷新分页列表的控件几乎可以说是必不可少的,但是每次开发一款产品都要重新开发,肯定是不可取的,那么最好是可以自己整理一个开发框架,那么以后开发,直接引入项目即可 网络框架的封装,从httpclient,到xutils,再到volley,再到okhttp,每次整合都发现多多少少的不足,目前自己觉得最成熟的一个也就是retrofit+okhttp3+rxjava的组合,rxjava不懂的推荐看大神的深入浅出rxjava,retrofit的使用自己网上搜咯 下拉刷新列表的实

自定义RecyclerView实现下拉刷新,加载更多

RecyclerView出来的时间已经不短了,现在估计大部分的列表类的需求实现首选肯定是RecyclerView,基本上可以跟ListView说再见了.那么问题来了,一般情况下一个列表页面都会有下拉刷新和加载更多功能,RecyclerView本身并没有下拉刷新和加载更多功能,当然现在已经有很多优秀的开源的支持下拉刷新,加载更多功能的三方RecyclerView,可以直接拿过来用.但是...有时候光会用是不够的,还需要知道它们是这么实现的,实现的原理是什么.下面就来介绍一下RecyclerView

python selenuim如何判断下拉框是否加载出来,超过时间不再等待

s_flag = True time_start = time.time() while s_flag: doc = etree.HTML(unicode.encode(driver.page_source, encoding='utf-8')) from_list = doc.xpath("""//*[@id="ext-gen267"]/div""") if len(from_list) == 0: time_end = t

vue2.0无限滚动加载数据插件

  做vue项目用到下拉滚动加载数据功能,由于选的UI库(element)没有这个组件,就用Vue-infinite-loading 这个插件代替,使用中遇到的一些问题及使用方法,总结作记录! 安装:npm install vue-infinite-loading –save 引入 ES6 import InfiniteLoading from 'vue-infinite-loading'; export default { components: { InfiniteLoading, }, }

向上滚动或者向下滚动分页异步加载数据(Ajax + lazyload)

/**** desc : 分页异步获取列表数据,页面向上滚动时候加载前面页码,向下滚动时加载后面页码 ajaxdata_url ajax异步的URL 如data.php page_val_name ajax异步的URL中的页码参数名 如pageno page_no 初始加载页码,默认1 [如2,则与前面两参数结合为data.php?pageno=2] is_lazyload 是否开启懒加载 page_count 总页数 empty_msg 没有数据的时候提示(可传输图片) ending_msg

apicloud如何实现优雅的下拉刷新与加载更多(Appcan也可类似实现)

apicloud中提供下拉刷新监听事件api,也提供滚动到底部事件的监听,能够实现下拉刷新和滚动到底部加载更多功能,但是我们真的就满足实现功能了吗?将两个代码拼凑起来运行看看发现了什么?是的,在滚动到底部加载更多的时候底部会弹动,有人可能会说触发加载更多的时候直接放一个遮罩view,也就是progress,用来禁止用户继续对当前view产生触摸事件就行,但是如果你很快滑动到底部呢,弹动现象仍然不能禁止.我曾向技术多次提过在下拉刷新api中提供一个参数用来控制是否禁用底部弹动的,但是前几次技术都是

自己定制ListView,上拉刷新和下拉刷新,加载网络图片,并且添加缓存机制。

1 package com.lixu.listviewrefresh; 2 3 import java.util.ArrayList; 4 import java.util.HashMap; 5 import java.util.Random; 6 7 import com.lixu.listviewrefresh.Loadnetimage.OnLoadnetimageListener; 8 import com.lixu.listviewrefresh.MyRefreshListview.On