mui框架实现分页功能（上拉加载，下拉刷新）以及点击事件的实现(1)

前端面试题汇总

JavaScript

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

性能

linux

前端资料汇总

4、判断有无数据时执行的逻辑：

if(data.result.length > 0) {

mui(‘#refreshContainer’).pullRefresh().endPullupToRefresh(false);//禁止刷新

} else {

layer.msg(“已经到底了”);

mui(‘#refreshContainer’).pullRefresh().endPullupToRefresh(true);//启动刷新

}

5、如果想隐藏底部的“没有更多数据了”，需要在css代码中添加一行代码：

.mui-pull-bottom-pocket {

display: none !important;

}

6、mui点击事件的实现：

mui(‘body’).on(‘tap’, ‘.shopList’, function() {//.shoplist就是你需要绑定的dom对象

var ext_id = $(this).attr(‘ext_id’);

console.log(ext_id);

mui.openWindow({

url: “newShop_details.php?ext_id=” + ext_id

})

})

7、取消页面的垂直滚动条：

.mui-scrollbar {

display: none !important;

}

下面是我的一个案例，是在搜索列表页面调用后台接口结合mui框架实现分页功能，