mui前端框架下拉刷新分页加载数据
前台
- mui.init();
- (function($) {
- //阻尼系数
- var deceleration = mui.os.ios?0.003:0.0009;
- $('.mui-scroll-wrapper').scroll({
- bounce: false,
- indicators: true, //是否显示滚动条
- deceleration:deceleration
- });
- $.ready(function() {
- //循环初始化所有下拉刷新,上拉加载。
- $.each(document.querySelectorAll('.mui-slider-group .mui-scroll'), function(index, pullRefreshEl) {
- if(index==0){
- // alert(index);
- $(pullRefreshEl).pullToRefresh({
- down: {
- callback:pulldownRefresh_zhengu
- },
- up: {
- callback: pullupRefresh_zhengu
- }
- });
- }else{
- // alert(index);
- $(pullRefreshEl).pullToRefresh({
- container:"#item2mobile .mui-scroll",
- down: {
- callback: pulldownRefresh_guandian
- },
- up: {
- callback: pullupRefresh_guandian
- }
- });
- }
- });
- bbb(1);
- aaa(1);
- var page = 1;
- var sum;
- var page1 = 1;
- var su;
- /*诊股开始*/
- function pulldownRefresh_zhengu(){
- var self = this;
- page++;
- setTimeout(function() {
- bbb(page);
- self.endPullDownToRefresh((sum <= page));
- }, 1000);
- }
- function pullupRefresh_zhengu(){
- var self = this;
- page++;
- setTimeout(function() {
- bbb(page);
- self.endPullUpToRefresh((sum <= page));
- }, 1000);
- }
- /*诊股结束*/
- /**观点开始**/
- function pulldownRefresh_guandian(){
- var self = this;
- page1++;
- setTimeout(function() {
- aaa(page1)
- self.endPullDownToRefresh();
- }, 1000);
- }
- function pullupRefresh_guandian(){
- var self = this;
- page1++;
- setTimeout(function() {
- aaa(page1);
- self.endPullUpToRefresh();
- }, 1000);
- }
- /**观点结束**/
- });
- })(mui);
然后写ajax请求,带入分页page。
后台对传过来的page参数进行处理:
- $page = I('page'); //获取请求的页数
- $pagenum = 15; //每页数量
- $start = ($page-1) * $pagenum;
- //查询数据
- limit($page,$pagenum)
mui前端框架下拉刷新分页加载数据的更多相关文章
- 微信小程序实战篇-下拉刷新与加载更多
下拉刷新 实现下拉刷新目前能想到的有两种方式 1. 调用系统的API,系统有提供下拉刷新的API接口 2. 监听scroll-view,自定义下拉刷新,还记得scroll-view里面有一个binds ...
- 移动端下拉刷新、加载更多插件dropload.js(基于jQuery/Zepto)
移动端下拉刷新.加载更多插件dropload.js(基于jQuery/Zepto) 原文:http://www.grycheng.com/?p=1869 废话不多说,先让大家看一下案例效果: DEMO ...
- H5 下拉刷新、加载更多
H5 下拉刷新.加载更多 demos const autoLoadMore = (url = ``) => { // todo ... } refs xgqfrms 2012-2020 www. ...
- 移动端下拉刷新、加载更多插件dropload.js(基于jQuery/Zepto)[转]
使用方法 引用css和js <link rel="stylesheet" href="../dist/dropload.min.css"> < ...
- 【微信小程序】转载:微信小程序实战篇-下拉刷新与加载更多
下拉刷新 实现下拉刷新目前能想到的有两种方式 1. 调用系统的API,系统有提供下拉刷新的API接口 当然,你可以直接在全局变量app.json的window里面配置上面这个属性,这样整个项目都允许下 ...
- apicloud如何实现优雅的下拉刷新与加载更多
apicloud中提供下拉刷新监听事件api,也提供滚动到底部事件的监听,能够实现下拉刷新和滚动到底部加载更多功能,但是我们真的就满足实现功能了吗?将两个代码拼凑起来运行看看发现了什么?是的,在滚动到 ...
- 自己定制ListView,上拉刷新和下拉刷新,加载网络图片,并且添加缓存机制。
package com.lixu.listviewrefresh; import java.util.ArrayList; import java.util.HashMap; import java. ...
- 解决:mui 的 选项卡 + 下拉刷新 功能,在其中嵌入 iframe 后,在 iphone 的情况下,iframe 的内容不能滚动,只显示第一屏内容。
我所遇到的情况是,使用 mui 的 选项卡 + 下拉刷新 功能时,其中有2个页面是嵌入了别的网站的页面,而别个几个是通过 ajax 加载本网站的数据.然后 在其中嵌入 iframe 后,在 iphon ...
- java攻城狮之路(Android篇)--widget_webview_metadata_popupwindow_tabhost_分页加载数据_菜单
一.widget:桌面小控件1 写一个类extends AppWidgetProvider 2 在清单文件件中注册: <receiver android:name=".ExampleA ...
随机推荐
- Elasticsearch:aggregation介绍
聚合(aggregation)功能集是整个Elasticsearch产品中最令人兴奋和有益的功能之一,主要是因为它提供了一个非常有吸引力对之前的facets的替代. 在本教程中,我们将解释Elasti ...
- win7如何设置以管理员身份运行
一.对所有程序以管理员身份运行 1.右键单击桌面“计算机”,选择“管理” 2.在页面左侧,依此打开“计算机管理(本地)→ 系统工具→本地用户和组→用户”,在右侧找到“Administrator”,双击 ...
- std::string 和 CString问题
std::string stdTemp; CString strTemp; strTemp = stdTemp; ;//这一步直接赋值可不可以 因为CString可以接受const char*的 ...
- CodeForces 1100F Ivan and Burgers
CodeForces题面 Time limit 3000 ms Memory limit 262144 kB Source Codeforces Round #532 (Div. 2) Tags da ...
- gridbagsizer
#coding:utf-8 import wx labels='1 2 3 4 5 6 7 8 9 '.split() class TestFrame(wx.Frame): def __init__( ...
- sqli-labs(31)
0x01找闭合 这里是WAF的jsp调到php的同样 第二个参数构造 偷看源码 闭合是") 我们尝试一下构造爆破数据库名 login.php?id=&id=-") unio ...
- socket的补充
- centos7没有IP地址
查看网卡 ip addr查看网卡 我截图中有ip,是因为我已经设置过了. eth0是对外的网卡,我们接下来设置这个网卡,你的网卡名字可能和我的不一样. 修改网卡 修改/etc/sysconfig/ne ...
- legend2---lamp.sh一键安装lamp环境需要爬的坑
legend2---lamp.sh一键安装lamp环境需要爬的坑 一.总结 一句话总结: 1.要记得更改项目权限:chown -R apache:apache /data/www/default/网站 ...
- 【零售App】—— react/ant design mobile项目爬坑
一.H5制作 - 图片文本的动画效果 bug:打开一个模板,添加图片,添加动画效果,若先选定动画效果,再调节动画时间和延迟时间,则动画和延迟时间没有改变:若先调节动画时间和延迟时间在选定动画效果,则动 ...