能直接运行的代码我这没有整理,这个是我项目里面的,你可以参考,三个选项卡,每个显示的内容不同
var tabsSwiper;//滑动插件
var dropload;//上拉分页
var itemIndex = 0;
var tabLoadEnd = new Array(3);
tabLoadEnd[0] = tabLoadEnd[1] = tabLoadEnd[2] = false;
$(function () {
//上拉分页
initDropload();
})
//初始化上拉分页
function initDropload() {
var num = 3; // 每页展示4个
var counter = new Array(3);//当前页
counter[0] = counter[1] = counter[2] = 1;
dropload = $('.swiper-wrapper').dropload({
scrollArea: window,
autoLoad: false,
domDown: {
domClass: 'dropload-down',
domRefresh: '
',
domLoad: '
',
domNoData: '
'
},
loadDownFn: function (me) {
$.ajax({
type: 'GET',
url: serviceUrl,
dataType: 'json',
data: {
Method: 'GetWeiXinOrderCard',
ItemIndex: itemIndex,//选项卡索引
PageIndex: counter[itemIndex]++,//当前页
PageSize: num //每页大小
},
success: function (data) {
// console.log(" 选项卡索引" + itemIndex + "data索引" + data.itemIndex + "总数" + data.total + "当前页" + counter[itemIndex] + " 当前页记录数" + data.rowcount);
if (itemIndex != data.itemIndex) {
//切换选项卡过快,手动数据添加到实际请求选项卡
itemIndex = data.itemIndex;
}
var result = '';
for (var i = 0; i < data.rows.length; i++) {
result += getCardHtml(data.rows[i]);//拼接card的html
}
$('.swiper-slide .list').eq(itemIndex).append(result);
if ((counter[itemIndex] - 1) * num > data.total) {
tabLoadEnd[itemIndex] = true; // 数据加载完
me.lock();//锁定
me.noData();//无数据
}
// 每次数据加载完,必须重置
me.resetload();
//counter[itemIndex]++;//当前页
},
error: function (xhr, type) {
me.resetload();
}
});
}
});
}