jquery pagination 官网:http://www.mricle.com/JqueryPagination
异步加载分页,分页内容需要样式
返回内容使用标签实现:以下是${ctx}/ajaxcontent/conclass/${contentclass.id} 路径访问的页面内容
[@wms_conclass_contentlist_page conclassid='${contentclass.id}' catid='${catid!}' pageSize='${pageSize!}' modelName='news']
{
"total": "${data.count}",
"data":" [#list data.getList()as val]aaaa[/#list]"
}
[/@wms_conclass_contentlist_page]
调用脚本:
<!--ajax异步翻页开始-->
<script src="static/assets/js/JqueryPagination/jquery-1.11.2.min.js"></script>
<script src="static/assets/js/JqueryPagination/jquery.pagination-1.2.7.min.js"></script>
<link rel="stylesheet" href="/static/assets/js/JqueryPagination/jquery.pagination.css" />
<ul class="list-groups " id="contentlist" style="height:292px;"> </ul>
<nav class="text-center" style="padding-top:5px;">
<div id="page3" class="m-pagination-page"></div>
<script type="text/javascript">
$("#page3").page({
pageSize:10,
showInfo: true,
firstBtnText: '首页',
lastBtnText: '尾页',
prevBtnText: '上一页',
nextBtnText: '下一页',
infoFormat: '{start} ~ {end}条,共{total}条',
remote: {
url: '${ctx}/ajaxcontent/conclass/${contentclass.id}',
params: { query: "test" },
success: function (result, pageIndex) {
$("#contentlist").html(result.data);
}
}
})
</script>
</nav>
<!--ajax异步翻页结束-->