上拉加载对象

/**
 * 上拉加载对象
 * @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("上拉加载更多");
	});

  

原文地址:https://www.cnblogs.com/shenjilin/p/10593585.html