mescroll下拉加载，上拉刷新原生JS库

                                       基础使用方法

                                            github地址：https://github.com/mescroll/mescroll

1.文件引入mescroll.min.css , mescroll.min.js

2.布局结构

<div id="mescroll" class="mescroll"> 
	 <div> 
		//内容...
	 </div>
</div>

外层的div id可以改成自己需要的id，class必须有mescroll，如果需要加另外的样式或事件，在class中再加自己的class就可以，但是mescroll必须保留。

3.设置mescroll的高度，如果有导航栏，必须要设置，没有导航栏的话，可以不用设置，自动到顶端,其他样式自己设置

			.mescroll{
				position: fixed;
				top: 44px;
				bottom: 0;
				height: auto;
			}

4.初始化MeScroll对象（核心）

var mescroll = new MeScroll("mescroll", {
	//下拉刷新,如果是重新刷新列表可不填,默认会将page.num置1，再调用up.callback
	/*
	down: {
		callback: downCallback //下拉刷新的回调,别写成downCallback(),多了括号就自动执行方法了
		},*/
				
	//上拉加载
	up: {
		page:{
		    num:0,//当前页,会自动自增,不写默认0
		    size:1,//每次加载的数据条数,不写默认10
		    },
		loadFull: {
			use: false, //列表数据过少,是否自动加载下一页,直到满屏或者无更多数据为止;默认false
			delay: 500 //延时执行的毫秒数; 延时是为了保证列表数据或占位的图片都已初始化完成,且下拉刷新上拉加载中区域动画已执行完毕;
			},
		noMoreSize: 5,//如果列表已无数据,可设置列表的总数量要大于5才显示无更多数据;提高用户体验
		callback: getListData, //上拉回调
		isBounce: false, //此处禁止ios回弹, 防止ios端在数据到底的时候下拉会出现一个黑块
		clearEmptyId: "dataList", //1.下拉刷新时会自动先清空此列表,再加入数据; 2.无任何数据时会在此列表自动提示空
		toTop:{ //配置回到顶部按钮
			src : "../res/img/mescroll-totop.png", //默认滚动到1000px显示,可配置offset修改
			offset : 500//设置滚动到500px时便显示回到顶部按钮
				},
		empty: {//列表第一页无任何数据时,显示的空提示布局; 需配置warpId才显示						
			warpId:	"mescroll", //父布局的id (1.3.5版本支持传入dom元素)
			icon: "../res/img/mescroll-empty.png", //图标,默认null,支持网络图
			tip: "暂无相关数据~" //提示
			},
		lazyLoad: {
			use: true, // 是否开启懒加载,默认false
			//attr: 'imgurl' // 标签中网络图的属性名 : <img imgurl='网络图  src='占位图''/>配置懒加载的png
			  }
		}
});

5.处理回调

5.1)下拉回调：如果创建对象是没有配置回调，这里也不用写，自动把page设为1，调用下拉的回调一次；

function downCallback() {
		$.ajax({
			url: 'xxxxxx',
			success: function(data) {
			//联网成功的回调,隐藏下拉刷新的状态;
			    mescroll.endSuccess(); //无参. 注意结束下拉刷新是无参的
			//设置数据
				//setXxxx(data);//自行实现 TODO
			},
			error: function(data) {
				//联网失败的回调,隐藏下拉刷新的状态
				mescroll.endErr();
			}
		});
}

5.2）上拉刷新回调；参数为page，创建对象时已配置page的num和size

//上拉加载的回调 page = {num:1, size:10}; num:当前页 默认从1开始, size:每页数据条数,默认10
function upCallback(page) {
	$.ajax({
		url: 'xxxxxx?num=' + page.num + "&size=" + page.size, //如何修改page.num从0开始 ?
		success: function(curPageData) {
		//联网成功的回调,隐藏下拉刷新和上拉加载的状态;
		//mescroll会根据传的参数,自动判断列表如果无任何数据,则提示空,显示empty配置的内容;
		//列表如果无下一页数据,则提示无更多数据,(注意noMoreSize的配置)
					
		//方法一(推荐): 后台接口有返回列表的总页数 totalPage
		//必传参数(当前页的数据个数, 总页数)
        //可选参数（systime : 加载第一页数据的服务器时间，防止数据重复）
		//mescroll.endByPage(curPageData.length, totalPage);
							
		//方法二(推荐): 后台接口有返回列表的总数据量 totalSize
		//必传参数(当前页的数据个数, 总数据量)
		//mescroll.endBySize(curPageData.length, totalSize);
							
		//方法三(推荐): 您有其他方式知道是否有下一页 hasNext
		//必传参数(当前页的数据个数, 是否有下一页true/false)
		//mescroll.endSuccess(curPageData.length, hasNext);
							
		//方法四 (不推荐),会存在一个小问题:比如列表共有20条数据,每页加载10条,共2页.
		//如果只根据当前页的数据个数判断,则需翻到第三页才会知道无更多数据
		//如果传了hasNext,则翻到第二页即可显示无更多数据.
		//mescroll.endSuccess(curPageData.length);
					
		//结束下拉刷新的 mescroll.endSuccess()无参.
		//结束上拉加载 curPageData.length必传的原因:
		1.使配置的noMoreSize生效
		2.判断是否有下一页的首要依据: 当传的值小于page.size时,则一定会认为无更多数据.
			比传入的totalPage, totalSize, hasNext具有更高的判断优先级
		3.当传的值等于page.size时,才会取totalPage, totalSize, hasNext判断是否有下一页
		    传totalPage, totalSize, hasNext主要目的是避免方法四描述的小问题
					
		//设置列表数据
		//setListData(curPageData);//自行实现 TODO
	 },
		error: function(e) {
		//联网失败的回调,隐藏下拉刷新和上拉加载的状态
		mescroll.endErr();
		}
  });
}