H5手机端下拉加载数据的实现
<script>var orderData = {"items": [],"pageNo":1,"pageSize":4}var vue = new Vue({el:"#itemsDiv",data:orderData});list();...
·
<script>
var orderData = {
"items": [],
"pageNo":1,
"pageSize":4
}
var vue = new Vue({
el:"#itemsDiv",
data:orderData
});
list();
function list() {
Common.getRemote({
type: "GET",
url: basePath +"/bss/ord/sendStaHistoryList",
data: {"pageNo":orderData.pageNo,"pageSize":orderData.pageSize},
dataType:"json",
async: true,
success: function (data) {
if (data != null && data.json.success) {
//判断接口返回的数组中有无数据
if(data.json.result.items!=null){
if(orderData.items==''||orderData.items==null){//第一页第一次加载
orderData.items = data.json.result.items;
}else{//下拉加载数组合并
orderData.items=orderData.items.concat(data.json.result.items);
}
}
} else {
alert(data.msg);
}
},
error: function (res) {
}
});
}
function orderDetails(e){
console.log($(e).attr('rel'));
LoadingTip.openUrl("${pageContext.request.contextPath}/bss/ord/ordDetails?ordPk="+$(e).attr('rel'));
}
//下拉加载数据
$(window).bind("scroll", function () {
if(getScrollHeight() == getDocumentTop() + getWindowHeight()){
// alert("滑到底部");
orderData.pageNo=orderData.pageNo+1;
list();
}
});
//文档高度
function getDocumentTop() {
var scrollTop = 0, bodyScrollTop = 0, documentScrollTop = 0;
if (document.body) {
bodyScrollTop = document.body.scrollTop;
}
if (document.documentElement) {
documentScrollTop = document.documentElement.scrollTop;
}
scrollTop = (bodyScrollTop - documentScrollTop > 0) ? bodyScrollTop : documentScrollTop;
console.log("scrollTop:"+scrollTop);
return scrollTop;
}
//可视窗口高度
function getWindowHeight() {
var windowHeight = 0;
if (document.compatMode == "CSS1Compat") {
windowHeight = document.documentElement.clientHeight;
} else {
windowHeight = document.body.clientHeight;
}
console.log("windowHeight:"+windowHeight);
return windowHeight;
}
//滚动条滚动高度
function getScrollHeight() {
var scrollHeight = 0, bodyScrollHeight = 0, documentScrollHeight = 0;
if (document.body) {
bodyScrollHeight = document.body.scrollHeight;
}
if (document.documentElement) {
documentScrollHeight = document.documentElement.scrollHeight;
}
scrollHeight = (bodyScrollHeight - documentScrollHeight > 0) ? bodyScrollHeight : documentScrollHeight;
console.log("scrollHeight:"+scrollHeight);
return scrollHeight;
}
</script>
部分转自https://blog.csdn.net/xiangyihu/article/details/53781081
更多推荐
已为社区贡献4条内容
所有评论(0)