手机端的下拉刷新和上拉加载

第一步，下载dropload插件，dropload插件下载地址
第二步，将下载好的dropload插件中的dropload.css，dropload.min.js文件引入到页面中，注意还要引用Jquery的js，因为dropload是基于jquery实现的
第三步，将以下代码放到页面的最底部，注意是最底部，否则dropload插件获取不了高度

    <div id="orderListDiv"  style="margin:10px 0%; width:100%;">
        <div id="lists">
        </div>
    </div>


<script type="text/javascript">
$(function(){
    var page = 0;// 页数
    var size = 5;// 每页展示5个
    var orderStatus = '${orderStatus}';

    $("#orderListDiv").dropload({
        scrollArea : window,  
        domUp : {  
            domClass   : 'dropload-up',  
            domRefresh : '<div class="dropload-refresh">↓下拉刷新</div>',  
            domUpdate  : '<div class="dropload-update">↑释放更新</div>',  
            domLoad    : '<div class="dropload-load"><span class="loading"></span>加载中...</div>'  
        },  
        domDown : {  
            domClass   : 'dropload-down',  
            domRefresh : '<div class="dropload-refresh">↑上拉加载更多</div>',  
            domLoad    : '<div class="dropload-load"><span class="loading"></span>加载中...</div>',  
            domNoData  : '<div class="dropload-noData">暂无数据</div>'  
           },  
        loadUpFn : function(me){  
                //下拉刷新需要调用的函数  
                location.reload();//window.reload();
                //重置下拉刷新  
                me.resetload();      
        },  
        loadDownFn : function(me){
           $.ajax({
               url: "xxxx",
               data: {
                   pageNo:page,
                   pageSize:size,
                   orderStatus:orderStatus
               },
               dataType: 'json',
               success: function(data){
                   var arrLen = data.orderList.length;
                   var result = "";
                   if(arrLen > 0){
                       page++;
                       for(var i=0; i<arrLen; i++){
                            //要显示的内容
                       }
                   }else{ // 如果没有数据
                       me.lock();// 锁定
                       me.noData();// 无数据
                   }
                   // 为了测试，延迟1秒加载
                   setTimeout(function(){
                       $('#lists').append(result);// 插入数据到页面，放到最后面
                       me.resetload();// 每次数据插入，必须重置
                   },1000);
               },
               error: function(xhr, type){
                   me.resetload();// 即使加载出错，也得重置
               }
           });
       }
    });
});
</script>

参考：http://blog.csdn.net/qq_29447481/article/details/69499944