标签:doc 地址 res 方便 比较 cas out data 初始
h5页面中使用上拉分页 可以引入 minirefresh-all.js 第三方插件来完成
// 初始化页码 var page = 0; // miniRefresh 对象 var miniRefresh = new MiniRefresh({ container: ‘#minirefresh‘, down: { isLock: false, //是否禁用下拉刷新 callback: function() { doAjax(‘down‘); } }, up: { isAuto: true, callback: function() { doAjax(‘up‘); } } }); // 组装 ajax 分页函数。参数 downOrUp 判断是下拉刷新还是上拉加载。 // 特别提示:若你仅使用下拉刷新或上拉加载的其中一项,可不用组装 ajax 分页函数了,直接将 ajax 分页放在下拉刷新或上拉加载的回调 callback 里。 var doAjax = function(downOrUp) { if(downOrUp == ‘down‘) { page = 1; // 下拉刷新页码设置 } else { page++; // 上拉加载递增页码 } $.ajax({ url: ‘data/listdata‘ + page + ‘.json‘, // 请求网址 type: ‘GET‘, data: { // 请求参数,一般会带上页码 ‘page‘: page, ‘t‘: new Date().getTime() // 防止GET请求缓存 }, success: function(data) { var json = eval("("+data+")"); var flag = json.code; var dat = json.data; var msg = json.msg; if(flag == "00"){ // 下面这段请根据自己的数据结构来处理 var arrLen = dat.length; if(arrLen > 0) { var html = ‘‘; for(var i = 0; i < dat.length; i++){ html += "<div class=‘li></div>" ; } setTimeout(function() { // 使用 setTimeout 函数是方便演示的,你可以不用 setTimeout 函数 if(downOrUp == ‘down‘) { $(‘#listdata‘).html(‘‘); $(‘#listdata‘).append(html); // DOM 插入数据 if(json.totalPages == page) { // 是否已取完数据页json.totalPages为总页数 miniRefresh.endDownLoading(true); // 结束上拉加载 } else { miniRefresh.endDownLoading(false); } } else { $(‘#listdata‘).append(html); if(json.totalPages == page) { // 是否已取完数据页 json.totalPages为总页数 miniRefresh.endUpLoading(true); // 结束上拉加载 } else { miniRefresh.endUpLoading(false); } } }, 300); } else { if(downOrUp == ‘down‘) { $(‘#listdata‘).html(‘‘); miniRefresh.endDownLoading(true); } else { miniRefresh.endUpLoading(true); } } }else{ alert(msg); } }, error: function() { if(downOrUp == ‘down‘) { $(‘#listdata‘).html(‘‘); miniRefresh.endDownLoading(true); } else { miniRefresh.endUpLoading(true); }; } }); };
但是最近发现这个插件对IOS 13以上的系统支持不是特别友好,所有对插件进行优化
无法修改插件使既使 安卓和IOS 13以下的版本适用同时也让IOS 13以上的版本适用 所以采用一种比较笨的办法解决
<!-- 引入 miniRefresh JS --> <script type="text/javascript"> var str= navigator.userAgent.toLowerCase(); var ver=str.match(/cpu iphone os (.*?) like mac os/); if(!ver){ document.write("<scr"+"ipt src=\"js/minirefresh-and-ios12.js\"></sc"+"ript>"); }else if(ver[1].replace(/_/g,".").substring(0,2) >= 13){ //alert("你当前的Ios系统版本为:"+ver[1].replace(/_/g,".")); document.write("<scr"+"ipt src=\"js/minirefresh-ios13.js\"></sc"+"ript>"); }else{ document.write("<scr"+"ipt src=\"js/minirefresh-and-ios12.js\"></sc"+"ript>"); } </script>
优化后的插件 下载地址:
链接: https://pan.baidu.com/s/1nb1Po59qyrqmif4hXymPYw 提取码: kxq1
标签:doc 地址 res 方便 比较 cas out data 初始
原文地址:https://www.cnblogs.com/1427wsl/p/12450815.html