• 上拉加载对象


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

      

  • 相关阅读:
    为服务部署 Jekins的使用
    spring cloud
    docker
    WebSocket
    idea
    maven
    SQL四种语言(DDL、 DML、 DCL、 TCL)
    十大经典排序
    AVL树的旋转图解和简单实现
    多个线程交替打印
  • 原文地址:https://www.cnblogs.com/shenjilin/p/10593585.html
Copyright © 2020-2023  润新知