/** * 上拉加载对象 * @param param,参数配置对象 * Jpm : 主容器对象,即固定高度可以滚动的 jQuery 对象,默认:$(document) * Jom : 内容容器对象,伸缩高度的 jQuery 对象, 默认:$("body") * rate : 灵敏度,页面滑动到距离底部多少触发回调,默认:15 * height: Jpm 所代表的 Dom 对象的高度,默认:屏幕高度 * @param cb,回调函数, 参数携带上拉加载对象 * @function,setScroll(isScroll) 当 isScroll 为true时,禁用上拉加载 */ function UpperLoading(param, cb) { if (typeof param != "object") console.error("UpperLoading 初始化参数错误"); param.jpm = param.jpm || $(document); param.jom = param.jom || $("body"); param.height = param.height || window.innerHeight; param.rate = param.rate || 15; cb = cb || function () {}; var isScroll = true; param.jpm.bind("scroll", function (ev) { if (isScroll) return; var scroll = param.jpm.scrollTop(); if (scroll + param.height > param.jom.height() - param.rate) { isScroll = true; cb(this); } }.bind(this)); this.setScroll = function (b) { isScroll = b }; cb(this); }
函数调用:
var up = new UpperLoading({ jom: $("#main"), rate: 50 },function(self){ $(".loading").show(); $(".loading").html("加载中,请稍候…"); setTimeout(function(){ for(var i=0;i<vm.pageSize;i++){ vm.dataList = vm.dataList.concat({"name":"这是测试数据"}); } self.setScroll(false); $(".loading").hide(); },2000); // $(".loading").html("上拉加载更多"); });