//后台方法
@RequestMapping(value = "/main/showNextPage.ajax/{page}", method = RequestMethod.POST)
@ResponseBody}
//页面html
<div class="mn-content" data-role="page" id="pageone">
<table class="table table-hover table-condensed">
<tbody id="list">
<tr>
<td>会员编号</td>
<td>会员昵称</td>
<td>身份</td>
<td style="width: 80px;">操作</td>
</tr>
<c:forEach items="${result.rows}" var="row" varStatus="status">
<tr>
<td>${row.memberAccount}</td>
<td>${row.memberName}</td>
<td>${row.registerGradeName}</td>
<td><a href="#" class="btn btn-primary btn-xs">详情</a></td>
</tr>
</c:forEach>
</tbody>
</table>
<ul class="pager" id="pager">
<c:choose>
<c:when test="${result.totalPage>result.page}">
<a href="javascript:void(0);" onclick="load('${ctx}','${memberPath}',2,'${result.totalPage}')">查看更多</a>
</c:when>
</c:choose>
</ul>
</div>
//js部分
function load(ctx,memberPath,page,totalPage){
$.ajaxPost(ctx+"/"+memberPath+"/main/showNextPage.ajax/"+page,null,function(result) {
var html ="";
var main = $("#list");
for(var i =0;i< result.rows.length;i++){
html +="<tr><td>"+result.rows[i].memberAccount+"</td>"+"<td>"
+result.rows[i].memberName+"</td>"+"<td>"
+result.rows[i].registerGradeName+"</td>"+
"<td><a href='#' class='btn btn-primary btn-xs'>详情</a></td>"+"</tr>"
}
main.append(html);
//如果还有下一页 则 显示加载更多 否则隐藏
if(totalPage>page){
page=parseInt(page)+parseInt(1);
$("#pager").html('<a href="javascript:void(0);" onclick="load(\''+ctx+'\',\''+memberPath+'\',\''+page+'\',\''+totalPage+'\')">查看更多</a>');
$("#pager").show();
}else{
$("#pager").hide();
}
});
}