一款兼容PC和移動設備的下拉刷新和上拉加載的組件

pull-load

一款兼容PC和移動設備的下拉刷新和上拉加載的組件，同時也支持滾動到底部加載和初始化後即開始加載

gitHub: https://github.com/xiyan1120/pull-load
OSChina: https://git.oschina.net/564468767/pull-load
尊重原創，轉載請註明轉自：http://www.javashuo.com/article/p-pqgzwvld-ha.html

###1.引入js：

<script type="text/javascript" src="dist/pull-load.min.js"></script>

###2.使用：

new PullLoad({
		//整個滾動層的容器的dom
		container:document.getElementById("outerScroller"),
                //指定滾動條的dom，不指定默認爲container  
                //scrollBar:document.getElementsByTagName("body")[0],    
		down:{
		    distance:50,//默認距離
		    enable:true,
		    callback:function (end) {
			setTimeout(function () {
			    console.log("end");
			    var isEmptyData = false;
			    end(isEmptyData);
			},1500);
		    }
		},
		up:{
		    distance:50,//默認距離，也是建立的div的默認g高度
		    isScrollLoad:false,
		    isInitLoad:false,
		    enable:true,
		    callback:function (end) {
			setTimeout(function () {
			    console.log("end");
			    var isEmptyData = false;
			    end(isEmptyData);
			},1500);
		    }
		}
	    });

###3.up：

up:{
			//這個距離是用於匹配是顯示上拉加載更多，仍是顯示釋放加載
			distance:50,
			//建立的div的容器，也是下面設置的html的父級
			container:'<div class="pull-load-container"></div>',
			//初始化時顯示的html
			init:'<div class="pull-load-up"><span><span class="pull-load-up-icon"></span>上拉加載更多...</span></div>',
			//加載時顯示的html
			loading:'<div class="pull-load-up loading"><span class="pull-load-up-icon"></span>加載中...</span></div>',
			//釋放的時候顯示的html
			release:'<div class="pull-load-up flip"><span><span class="pull-load-up-icon"></span>釋放加載...</span></div>',
			//沒有數據的時候顯示的html
			emptyData:'<div class="pull-load-empty-data">沒有更多數據了</div>',
			//是否可用
			enable:true,
			//是否滾動到div底部就加載。
			isScrollLoad:false,
			//是否初始化完成後就加載
			isInitLoad:false,
			//回調函數，參數爲調用結束要執行的函數
			callback:function(end){
				//未加載到數據的時候設置爲true，不然爲false
				var isEmptyData = true;
				//這個函數有個參數，用於設置是否已經沒有數據了。
				end(isEmptyData)
			}
		}

###4.down（描述同up）:

down:{
			//這個距離是用於匹配是顯示上拉加載更多，仍是顯示釋放加載，同時也是要建立的底部div的默認高度
			distance:50,
			container:'<div class="pull-load-container"></div>',
			init:'<div class="pull-load-down"><span><span class="pull-load-down-icon"></span>下拉刷新...</span></div>',
			loading:'<div class="pull-load-down loading"><span class="pull-load-down-icon"></span>刷新中...</span></div>',
			release:'<div class="pull-load-down flip"><span><span class="pull-load-down-icon"></span>釋放刷新...</span></div>',
			emptyData:'<div class="pull-load-empty-data">沒有更多數據了</div>',
			enable:true,
			callback:null
		}