移动端 H5 上拉刷新,下拉加载
http://www.mescroll.com/api.html#options
这里有几个重要的设置
1、down 下不启用下拉刷新是因为再手机端有默认的下拉刷新,会冲突,待解决
2、up 中的
auto 是第一次自动加载;
page是设置分页的size,一般num不在这里设置
clearEmptyId 是没有数据时显示提示无数据的容器Id
callback 是回调地址
//创建MeScroll对象
var mescroll = new MeScroll("mescroll",
{
down: {
use: false
},
up: {
auto: true,
page: { size: 5 },
clearEmptyId: "dataList",
callback: upCallback //上拉加载的回调
}
}); /*上拉加载的回调 page = {num:1, size:10}; num:当前页 从1开始, size:每页数据条数 */
function upCallback(page) {
//console.log("upCallback_num:" + page.num);
var olddata = null;
if (page.num !== 1) {
olddata = $scope.orders;
} $scope.searcher.Page = page.num;
$scope.searcher.Rows = page.size;
//console.log("Page:" + $scope.searcher.Page + "&Rows:" + $scope.searcher.Rows);
$http.post(apiUrl + "api/weixintruck/getlist", $scope.searcher).success(
function(data) {
//console.log(data.data);
if (data.code === 200) {
if (data.data.TotalItem > $scope.searcher.CurrentPage * $scope.searcher.PageSize) {
$scope.hasNextPage = true;
} else {
$scope.hasNextPage = false;
}
$scope.orders = data.data.Items;
if (olddata !== null && typeof (olddata) !== "undefined") {
$scope.orders = olddata.concat($scope.orders);
} mescroll.endBySize($scope.orders.length, data.data.TotalItem);
} else {
layer.open({
content: '非法操作',
skin: 'msg',
time: 2 //2秒后自动关闭
});
mescroll.endErr();
}
}).error(function() {
mescroll.endErr();
});
}
移动端 H5 上拉刷新,下拉加载的更多相关文章
- jQuery模拟原生态App上拉刷新下拉加载
jQuery模拟原生态App上拉刷新下拉加载效果代码,鼠标上拉时会显示loading字样,并且会模拟加载一条静态数据,支持触屏设备使用. <!doctype html> <html ...
- Android之 RecyclerView,CardView 详解和相对应的上拉刷新下拉加载
随着 Google 推出了全新的设计语言 Material Design,还迎来了新的 Android 支持库 v7,其中就包含了 Material Design 设计语言中关于 Card 卡片概念的 ...
- Flutter学习笔记(25)--ListView实现上拉刷新下拉加载
如需转载,请注明出处:Flutter学习笔记(25)--ListView实现上拉刷新下拉加载 前面我们有写过ListView的使用:Flutter学习笔记(12)--列表组件,当列表的数据非常多时,需 ...
- 微信小程序 上拉刷新/下拉加载
小程序项目中上拉刷新下拉加载是比较常见的需求,官方文档也提供了相当友好的API,但是因为API隐藏的比较深,文档描述也比较模糊所以也折腾了一番(官方文档),在此记录一下使用方式 onPullDownR ...
- ListView上拉刷新和分页加载完整的Dome
很多人工作的过程中都会碰到ListView下拉刷新和分页加载,然后大多数公司都已经把框架写好了,大家直接用就可以了,有些人一直对这个事情处于迷茫状态,为了让大家对上拉刷新和分页加载有一个比较全面的认识 ...
- jQuery WeUI 组件下拉刷新和滚动加载的实现
最近在做手机版使用到了下拉刷新和滚动加载,记录一下实现过程: 一.引入文件 ? 1 2 3 4 <link rel="stylesheet" href="Conte ...
- 实现app上对csdn的文章列表上拉刷新下拉加载以及加入缓存文章列表的功能 (制作csdn app 四)
转载请标明出处:http://blog.csdn.net/lmj623565791/article/details/23698511 今天继续对我们的csdn客户端未完成的功能进行实现,本篇博客接着客 ...
- XRecyclerView上拉刷新下拉加载
效果图: 首先要添加依赖: //xrecyclerviewimplementation 'com.jcodecraeer:xrecyclerview:1.3.2'//Gsonimplementatio ...
- iOS:延迟加载和上拉刷新/下拉加载的实现
lazy懒加载(延迟加载)UITableView 举个例子,当我们在用网易新闻App时,看着那么多的新闻,并不是所有的都是我们感兴趣的,有的时候我们只是很快的滑过,想要快速的略过不喜欢的内容,但是只要 ...
- MUI - 上拉刷新/下拉加载
新闻信息列表必备的功能,支持Table,Ul等列表. 以下是DIV版本,在安卓端或者ios端必须使用双webview模式,传送门:http://dev.dcloud.net.cn/mui/pulldo ...
随机推荐
- linux查看文件的编码格式的方法 set fileencoding
查看文件编码在Linux中查看文件编码可以通过以下几种方式:1.在Vim中 可以直接查看文件编码:set fileencoding即可显示文件编码格式.如果你只是想查看其它编码格式的文件或者想解决 用 ...
- 在 Java 应用程序中加一些 Groovy 进来
如果您一直在阅读这个系列,那么您应该已经看到有各种各样使用 Groovy 的有趣方式,Groovy 的主要优势之一就是它的生产力.Groovy 代码通常要比 Java 代码更容易编写,而且编写起来也更 ...
- opencv常见示例
1.批量转换灰度图并保存 #include <iostream> #include <opencv2/opencv.hpp> #include <string> u ...
- 最简易的python web框架的后端实现
1.源代码 #!/usr/bin/python #encoding=utf-8 from flask import json, Flask, request app = Flask(__name__) ...
- 好用的开源SVN仓库
1.地址 https://svnbucket.com/#/projects 2.简单注册使用即可
- jQuery前端插件以及图片延迟加载
插件名称 用途 插件官网地址 fontawsome CSS图标插件 http://fontawesome.io easyui 基于jQuery的用户界面插件集合 http://www.jeasyui. ...
- python 类型注解
函数定义的弊端 python 是动态语言,变量随时可以被赋值,且能赋值为不同类型 python 不是静态编译型语言,变量类型是在运行器决定的 动态语言很灵活,但是这种特性也是弊端 def add(x, ...
- [Vue warn]: Do not use built-in or reserved HTML elements as component id: content
错误如下: 报错原因: 不能使用内建标签,组件不能和html标签重复. 解决办法: 把name改成mContent解决.
- Java遍历日期代码
import java.util.ArrayList; import java.util.List; public class DateTraveller { public static List&l ...
- iOS-Foundation各种NS
1.1 NSRange NSRange range = NSMakeRange(2, 4);//location=2,len=4 NSString *str = @"i love oc ...