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)
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 如何编写易于单元测试的代码
· 10年+ .NET Coder 心语,封装的思维:从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热?
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
· 10年+ .NET Coder 心语 ── 封装的思维:从隐藏、稳定开始理解其本质意义
· 地球OL攻略 —— 某应届生求职总结
· 周边上新:园子的第一款马克杯温暖上架
· Open-Sora 2.0 重磅开源!
· 提示词工程——AI应用必不可少的技术