自己试验过的复制过去修改一下mui.js路径可以直接用
HTML代码：
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0"> <link rel="stylesheet" href="mui/css/mui.css"/> <title>我的报修工单</title> </head> <body> <script src="js/jQuery-1.11.1-min.js"></script> <div id="tv" class="mui-content mui-scroll-wrapper"> <div class="mui-scroll"> <ul class="mui-table-view mui-table-view-chevron"> <ul style="padding: 3px 0 3px 0"> <div class="weui-actionsheet__cell" style="padding: 2px 0 2px 0"> <h4>我的工单列表</h4> </div> <div class="" style="background: #666;height: 200px;;"> </div> <div class="" style="background: #999;height: 200px;;"> </div> <div class="" style="background: #000;height: 100px;;"> </div> </ul> <ul class="mui-table-view" id="wx_ul"> <!-- 动态加载数据 --> </ul> </ul> </div> </div> <!-- ############ 分割线 ############# --> <div id="dialogs"> <!--BEGIN error--> <div class="js_dialog" id="error" style="display: none;"> <div class="weui-mask"></div> <div class="weui-dialog"> <div class="weui-dialog__bd">系统错误</div> <div class="weui-dialog__ft"> <a href="javascript:;" class="weui-dialog__btn weui-dialog__btn_primary">知道了</a> </div> </div> </div> <!--END error--> <!--BEGIN loadError--> <div class="js_dialog" id="loadError" style="display: none;"> <div class="weui-mask"></div> <div class="weui-dialog"> <div class="weui-dialog__bd">加载数据发生错误</div> <div class="weui-dialog__ft"> <a href="javascript:;" class="weui-dialog__btn weui-dialog__btn_primary">知道了</a> </div> </div> </div> <!--END loadError--> </div> </body> </html>
js代码：
<script type="text/javascript" src="mui/js/mui.min.js"></script> <script> mui.init({ swipeBack : false,//侧滑返回组件 pullRefresh : { container : '#tv', //一个功能的一部分 down : { callback : pulldownRefresh,//callback事件回调冒号后面就是方法 height : 60, auto : false, contentdown : "下拉可以刷新", }, up : { height : 50, auto : false, contentrefresh : "正在加载...", contentnomore : '没有更多数据了', callback : pulluptoRefresh } } }); $("#wx_ul").on('tap', 'a', function (event) {//这很重要！！！ // console.log("ss");//mui框架下拉刷新上拉加载，click事件无效的解决方法 this.click();//我有一篇专门写这个小问题。 }); //下拉刷新 function pulldownRefresh() { setTimeout(function() { //三秒后执行函数 window.location.reload();//刷新 mui('#tv').pullRefresh().endPulldownToRefresh(); //用来停止刷新 }, 2000); } //上拉加载 function pulluptoRefresh() { setTimeout(function() { //2秒后执行函数 console.log(1);//上拉加载 这是我其他js里面写的方法，我这里调用就行了。 //mui('#tv').pullRefresh().endPullupToRefresh(true);//true加载的那个会变成，没有更多数据了 mui('#tv').pullRefresh().endPullupToRefresh(false); }, 1000); //这里可有可无，自己根据自己的情况。 // setTimeout(function() { //3秒后执行函数 // //停止刷新（加载） // mui('#tv').pullRefresh().endPullupToRefresh(false); // }, 4000); } </script>
有问题请留言：
详细介绍：https://blog.csdn.net/qq_36073929/article/details/53905842