html 结构

  <div id="main">
<ul class="order-list" id="list_box">
// li
</ul>
      
         <div id="getmore">
正在加载。。。
         </div>
</div>

script部分

 var page = 1, //分页码
off_on = false, //分页开关
timers = null; //定时器
var p = 0, t = 0;
//加载数据
var LoadingDataFn = function () {
$("#getmore").show()
var dom = '';
for (var i = 0; i <; i++) {
dom += '<li>'+i+'</li>';
}
$("#getmore").hide() $('#list_box').append(dom);
off_on = true;
}; //初始化, 第一次加载
$(document).ready(function () {
LoadingDataFn();
}); $(window).scroll(function () {
//当时滚动条离底部60px时开始加载下一页的内容
p = $(this).scrollTop(); if (t <= p) {//下滚
//
if (($(window).height() + $(window).scrollTop() + 60) >= $(document).height()) {
clearTimeout(timers);
timers = setTimeout(function () {
page++;
console.log("第" + page + "页");
LoadingDataFn()
}, 300);
}
} else {//上滚
//
}
setTimeout(function () { t = p; }, 0);
});

jq上滑加载更多的更多相关文章

  1. Android如何定制一个下拉刷新,上滑加载更多的容器

    前言 下拉刷新和上滑加载更多,是一种比较常用的列表数据交互方式. android提供了原生的下拉刷新容器 SwipeRefreshLayout,可惜样式不能定制. 于是打算自己实现一个专用的.但是下拉 ...

  2. vue 上滑加载更多

    移动端网页的上滑加载更多,其实就是滑动+分页的实现. <template> <div> <p class="footer-text">--{{f ...

  3. Android的ListView分页功能(上滑加载更多)

    今天主要工作是将之前实现的各种ListView显示全部信息,优化成了每次加载几条数据,然后上滑的时候加载更多,底部显示一个进度条和一个文字提示,然后加载完毕后,将提示信息隐藏. 一边看教学视频一遍敲代 ...

  4. 移动端web页面上滑加载更多功能

    背景介绍: 开发企业微信的一个应用,实现在企业微信中调用自己程序页面,页面加载多模块数据,向下滑加载更多,等等等等,一波三折 然后很早就成功了是这样实现的: html: <div id=&quo ...

  5. 使用jquery.more.js上滑加载更多

    html: <div id="more"> <div class="single_item"> <div class=" ...

  6. 微信小程序上滑加载更多

    onReachBottom: function () { var that = this var limit = that.data.limit var count = that.data.count ...

  7. APICloud 上滑加载更多

    <!DOCTYPE html><html>        <head>        <meta charset="UTF-8">  ...

  8. jquery 上滑加载更多

    $(document).ready(function() { var totalPage = {$totalPage};//总页数 var page = {$page}; //起始页 var page ...

  9. 微信小程序 scroll-view 完成上拉加载更多

    我们经常在软件客户端上看到这么一个功能,当我们阅读信息浏览到文章的末尾时,通常会加载出更多的信息.比如,我们在简书客户端上浏览推荐文章时,浏览到屏幕的末尾,此时又加载出了另一页的推荐文章,即实现了上拉 ...

随机推荐

  1. 往Angular应用程序中添加DevExtreme

    To start this tutorial, you need an Angular 5+ application created using the Angular CLI. Refer to t ...

  2. PHP JSON数据 AJAX

    JSON数据的定义方式 //写入数据 var a = { code:"p001", name:"张三", shuzu:new Array(1,2,3,4), j ...

  3. [Java]用于将链表变成字符串并在元素之间插入分隔符的有用函数“String.join”

    将链表变成字符串并在元素之间插入分隔符,这种动作最常见于组合sql文“select a,b,c from tb”这种场景scenario,其中a,b,c你是存贮在链表中的, 如果要加逗号要么在循环中识 ...

  4. StackTraceElement 源码阅读

    StackTraceElement 属性说明 /** * 每个 StackTraceElement 对象代表一个独立的栈帧,所有栈帧的顶部是一个方法调用 * @since 1.4 * @author ...

  5. Linux内存简单汇总

    Linux内存主要用来存储系统和应用程序的指令,数据,缓存等 一,内存映射 1,内核给每个进程提供一个独立的虚拟机地址空间,并且这个地址空间是连续的 2,虚拟地址空间内部又被分为内核空间和用户空间 3 ...

  6. 深入学习重点分析java基础---第一章:深入理解jvm(java虚拟机) 第一节 java内存模型及gc策略

    身为一个java程序员如果只会使用而不知原理称其为初级java程序员,知晓原理而升中级.融会贯通则为高级 作为有一个有技术追求的人,应当利用业余时间及零碎时间了解原理 近期在看深入理解java虚拟机 ...

  7. flutter textfield设置高度后内容区无法居中?

    textfiled 设置高度后,内容永远无法居中,最后找到原因 decoration: 中有一个 contentPadding属性,设置这个属性对应的Padding值即可

  8. Mysql(一)、索引研究

    一.索引简介 1. 为什么要使用索引 查询高效 2. 什么样的信息能成为索引 主键,唯一键,普通键等 二.优化你的索引 1. 二叉查找树 二叉查找树,也称二叉搜索树,或二叉排序树.其定义也比较简单,要 ...

  9. jmeter设置全局变量与正则表达式提取器

    接口测试中,很多接口都要带上登录后的token才能正常发送请求,这里记录一下登录获取token设置为全局变量供其他接口使用 登录后返回信息信息中会有一个token值,添加后置处理器中的正则表达式提取t ...

  10. Django 字段更新时报错

    字段更新时会报错: -------------------------------------------------------------- 无法向未定义字段添加默认值您确认添加默认值吗? 请添加 ...